Model.reject() results invalid fields in extjs form - javascript

I'm using Extjs 5.1.
I have a form which is bind to view model.
My form has few mandatory fields.
To reset form values am using model.reject() method.
When I enter a value in mandatory field and click reset button, it results invalid field with red colour border.
I have created a fiddle here for your reference. You can test this by entering a value into the input field and then click on reset button. Then field becomes invalid with red colour border.
How to get rid of this invalid field issue on reset ?

set Custom panel to extend Ext.form.Panel instead of Ext.Panel
add me.reset() in line 62, after co.reject();

Related

Fill out input field with code doesn't trigger onChange functions

I am working on customJs for swagger.
There I want to fill out an input field in advance for my use case.
Basically I can't see the code attached to the input field generated by swagger, but I can fill the input field with inputElement.setAttribute('value',"some stuff" )
But this does not trigger function as it seems, because when I proceed to use the submit button, it says the field is empty, only after I MANUALLY typed a letter and removed it, it recognized my changes.
Can I somehow trigger whatever the underlying function might be?

How to Validate Form fields one by one with Parsley Js

I am trying to Validate a Form with Parsley JS But when I hit submit it's adding error class in all fields but I want that it should validate fields one by one.
So if the 5 inputs are required and I it submits without filling any of them so want to show error in the 1st input only. after that if i fill 1st input and left the other 4 then it should show error in the second input only. I am just using this code for my form now.
$('#formid').parsley( //nothing here for now );
Set a specific priority to each input in the order you want them validated. Parsley will stop validation as soon as an error is detected at a given priority level.

Form validation in javascript when drop down dependency is involved

I have used ng-disabled for my form validation for ADD button.
i.e. ng-disabled="conditionForm.$invalid". But , My form contains two text boxes which are hidden at first , and when a type is selected from drop down , only the respective Text box div should be visible. The Problem i'm facing is ,when the above ng-disabled validation is used , the ADD button is still disabled when one of the text box is selected and an input is provided. After the second input is also selected from the drop-down , then the ADD button is getting enabled.
Can you please provide me with an alternate validation , where the ADD button can get enabled every time a value is selected from drop down and a valid input is provided.
If you're ng-disabled is on a form being valid or invalid it sounds like those may have required inputs set. If that is case look at using ng-required so you can explicitly set required based on expression. You can then control when the form is valid.
The exact answer: Answer

What changes to DOM are made when MVC Validation triggers?

I have a form in a modal window that is currently performing some validation.
(I am using ASP.NET MVC, JQuery UI, ajax forms, data annotations and unobtrusive is active)
When this validation triggers I have noticed so far that it does a few things:
1: my validation summary gets it's class changed from .validation-summary-valid to .validation-summary-errors
2: my invalid inputs have a class added to then called .input-validation-error
3: my validation messages get their class changed from .field-validation-valid to .field-validation-error
But there is something else that it is doing and I cant work out how it is tracking this.
I have a textbox that is required, before triggering the validation i can select inside this box, then select another box and the validation will be silent.
But as soon as i trigger the validation by clicking submit with an empty textbox, i can select the textbox and type something to remove the validation instantly, but if i then null it and select a different box this error is re-applied without re-submitting.
So my question is: what has changed, how does it know that I have attempted to submit already?
When validate is called, it adds a class to each input/select that is supposed to be validated. When the input/select is not valid it adds a class to the input/select:
class="input-validation-error"
When it is valid, it adds:
class="valid"
Validation only fires on the control when you change the value, not when it loses focus.
Validation fires on change, even before you submit the form. Take a required textbox, add a value to it, and tab off ... then go back and remove that value, and you should see the textbox highlighted red.

javascript and dynamic data

I'm using Dynamic Data 4 on my project.
In a template field there's a button that modify (via javascript) the value of the databound input field.
The button modify the input box value correctly but when the input field get the focus his value it's resetted to the previous value. The same happens when saving the form. If the input box previously received input from the keyboard the value it's correctly stored.
Is that behaviour to be considered normal with those premises? There's a way to avoid it?
Thank you very much.
The problem was caused by the presence of an associated asp:TextBoxWatermarkExtender who resetted the value when the (originally null) textbox got the focus.

Categories