Validating a non-existent field error in console - vue.js

My problem is I am getting this error when I try to validate my fields with VeeValidate on my system.
Uncaught (in promise) Error: [vee-validate] Validating a non-existent field: "". Use "attach()" first.
at createError (vee-validate.esm.js?00d1:297)
at Validator._handleFieldNotFound (vee-validate.esm.js?00d1:2282)
at Validator.validate (vee-validate.esm.js?00d1:1959)
at ScopedValidator.validate (vee-validate.esm.js?00d1:3276)
at VueComponent.next (QueryAcademicForm.vue?f0b2:332)
at click (eval at ./node_modules/vue-loader/lib/template-compiler/index.js?{"id":"data-v-e5b3dc5a","hasScoped":false,"transformToRequire":{"video":["src","poster"],"source":"src","img":"src","image":"xlink:href"},"buble":{"transforms":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./src/components/QueryAcademicForm.vue (0.3f605440c8faec0820bd.hot-update.js:22), <anonymous>:364:25)
at invoker (vue.esm.js?efeb:2027)
at HTMLButtonElement.fn._withTask.fn._withTask (vue.esm.js?efeb:1826)
I tried to replicate it here on jsfiddle, it gives me same error but there is little bit difference in error message
Uncaught (in promise) Error: [vee-validate] Validating a non-existent field: "result". Use "attach()" first.
at Re (vee-validate.min.js:1)
at vn._handleFieldNotFound (vee-validate.min.js:1)
at vn.validate (vee-validate.min.js:1)
at ln.validate (vee-validate.min.js:1)
at a.validateBeforeSubmit ((index):355)
at click (eval at $a (vue.min.js:6), <anonymous>:2:4043)
at t (vue.min.js:6)
at HTMLButtonElement.Ir.t._withTask.i._withTask (vue.min.js:6)
One thing to notice that error is not on every instance of form-input component rather only on the last step.

The issue appears due to "in-place patch" strategy that Vue.js uses. This case is described in the VeeValidate documentation. Basically, you need to tell Vue.js to track all child components separately by setting unique value to the key attribute for each input element:
<form-input key="unique"></form-input>
Here is a working JSFiddle example.

In my case it did appear because my HTML dynamically renders based on the certain condition and I was using this piece of code <div v-if="condition"... > for dynamic rendering. Despite the fact I was using unique key.
To solve the issue, I've changed the v-if to v-show like this <div v-show="condition"... > and error's gone.
Reference

Related

Formik FieldArray error messages - React Native

I'm using Formik FieldArray as part of my form and would like to show error messages, I can access the error messages within a component via errors.familyMembers[0], which looks like
[{"first_name": "First Name is a required field", "last_name": "Last Name is a required field"}]
To show the error I have 2 parts where I need to extract the error message
isInvalid={fieldName in errors.familyMembers[0] && touched[fieldName]}
<FormErrorMessage
message={errors.familyMembers[0][fieldName]}
isVisible={touched[fieldName]}
/>
The problem is when the component is initially rendered errors.familyMembers[0] is undefined, which gives me the error
undefined is not an object (evaluating 'errors.familyMembers[0]')
Is there a way I can guard against undefined and have the messages show if available? Hope that makes sense
You can use Optional chaining, like:
isInvalid={errors?.familyMembers && fieldName in errors.familyMembers[0] && touched[fieldName]}
<FormErrorMessage
message={errors?.familyMembers?.[0][fieldName]}
isVisible={touched[fieldName]}
/>
The optional chaining operator (?.) enables you to read the value of a
property located deep within a chain of connected objects without
having to check that each reference in the chain is valid.

InvalidSelectorException: invalid selector: Unable to locate an element with the xpath expression contains(text() error message

I'm getting this error message when selenium/C# program tried to click on an element in a drop down list in Dynamis365.
Inner Exception 1:
InvalidSelectorException: invalid selector: Unable to locate an element with the xpath expression contains(text(), 'Submitted') because of the following error:
TypeError: Failed to execute 'evaluate' on 'Document': The result is not a node set, and therefore cannot be converted to the desired type.
(Session info: chrome=87.0.4280.88)
My Code is:
internal void SetValues()
{
findByElement.FindByXPath("//span[contains(text(), 'Submission Pending')]").Click();
findByElement.FindByXPath("contains(text(), 'Submitted')").Click();
}
The HTML is:
<span id="id-bc19d003-2d6a-43ad-8e1b-566ecbb00647-132-statuscode6-statuscode.fieldControl-pickliststatus-comboBox_text-value" class=" ">Submission Pending</span>
I'm trying to click on Submitted choice, which do not show in HTML:DropDownList
Note: The other drop down list choices do not show in html. Only after making a choice (Submitted) it shows up in the html (replaces Submission Pending")
Submission Pending
Submitted clicked
Are you sure the page has fully loaded? Have you read the docs, specifically the 'waits' section (link below for the python version). I had this problem and simply put a 5 second delay into the code and it worked fine.
https://selenium-python.readthedocs.io/waits.html
Alternatively you may find it easier locating the element by id rather than by XPath
FindByXPath("contains(text(), 'Submitted')")
This is not a valid XPath expression! All XPath must start with the slash / character. Perhaps you meant something like:
FindByXPath("//*[contains(text(), 'Submitted')]")
Below line of code worked:
findByElement.FindByXPath("//*[./text()='Submitted']").Click();

Error "TypeError: Cannot read property 'ODP' of undefined" on node-red

I'm developing a program in node-red that gets tags from a database and should then "write" the value of them on a connected plc, but some tags are not passed due to this error "TypeError: Cannot read property 'ODP' of undefined" the script inside the node that from error is the following :
"msg.payload = {"value":[''+msg.payload[0].ODP+'']};
return msg;"
the tags are : OPD (string[30]) , DATA(string[10] , QUANT_INIZIALE DINT , QUANT_PROD DINT
The error implies that your input msg.payload to the function node is not an array.
It is not possible to see in the image you have posted, exactly which node the error is happening on, but if you attach a debug node before point you should be able to see what the input message looks like.

Oracle APEX: Error: SyntaxError: Unexpected end of JSON input

I'm having an issue where I've got a button that's action is to 'submit page' upon being clicked. The code then executes a PL SQL statement:
IF :REQUEST = 'btn_create_company' THEN
INSERT INTO COMPANIES (company_name) VALUES(:COMPANY_NAME);
However, when the code comes to execute, whilst it is adding the entry to the database, I'm getting this error on the client which is preventing the page from redirecting after processing:
Error: SyntaxError: Unexpected end of JSON input
I don't understand why this is happening as I'm confident there's nothing wrong with the above statement.
Ok, so I get this problem too, It's when I submit the page but instead of reload the whole page, I'm running a process and stay there.
The process itself works well, however I get the error message, just like you.
So I don't get the a solution, but found a workaround by adding this to the end of my process:
apex_json.open_object;
apex_json.write('success', true);
apex_json.close_object;
You are missing the page number on :COMPANY_NAME. It should be something like :P1_COMPANY_NAME
I was encountering a similar error when operating the last page in a chained dialog (aka "wizard") I had created.
The cause of my issue was that I had created a branch on the "After Submit" with the Behaviour/Type attribute set to "PL/SQL Procedure" and then had the code I wanted to be executed within the PL/SQL code attribute. When the "Finish" button was clicked, I was seeing the same error.
My resolution was to delete the branch and instead to use Create Process, with the Identification/Type set to "PL/SQL Code" and then placing the code I wanted to be executed within the "Source/PL/SQL Code" attribute.

Why I get the error: "Attempted to unrender a fragment that was not rendered" when migrating from ractive.js 0.3.9 to 0.5.5

I have a long, complex and a little dirty set of templates that works OK in 0.3.9 but not in 0.5.5 where I get the error: "Attempted to unrender a fragment that was not rendered".
My template is very complex but I could reproduce a slice that works in 0.3.9 but not in 0.5.5.
This is how it works OK in 0.3.9: http://jsfiddle.net/Katio/ujx2e/
This template in 0.5.5 shows the mentioned error: http://jsfiddle.net/Katio/W3Lus/
Attempted to unrender a fragment that was not rendered
Edit 1:
Thaylon has opened an issue in Ractive project on Github:
https://github.com/ractivejs/ractive/issues/1003
I must admit I'm not sure what the root of the problem is.
Yet, change the beginning of line 33 in your template from:
{{^.responsable}}<span class="redOutline" data-validationmess="Solicitud ({{num+1}}) '{{../../nombreSubdata.values[0]}}', sección '{{nombre.values[0]}}', responsable no asignado.">(responsable no asignado)</span>{{/.responsable}}
to:
{{^responsable}}<span class="redOutline" data-validationmess="Solicitud ({{num+1}}) '{{../../nombreSubdata.values[0]}}', sección '{{nombre.values[0]}}', responsable no asignado.">(responsable no asignado)</span>{{/responsable}}
and it will render.
http://jsfiddle.net/W3Lus/2/
Edit
A pretty minimal example that exhibits the error is: http://jsfiddle.net/W3Lus/9/
Removing any part, even the static <option>, it will render.
Doesnt look like you're doing anything wrong, seems to be a bug.
Edit
I assume binding the select value to {{.responsable}}, when it does not resolve to anything, causes this, as long as there is any option in the select that actually would be bound to the non-existing value.
Edit
Minimal examples with different buggy results:
http://jsfiddle.net/W3Lus/13/
http://jsfiddle.net/W3Lus/12/
One wont render at all, the other wont render a part that it should.