Trigger validation and redraw on different component via ajax - ajax

I have a wicket page with a couple of TextFields that have different kind of validators. So far, validation is triggered via Ajax on the onChange event.
I also have a checkbox that defines which set of validation rules should be used for the TextFields.
If I click the checkbox and then input data into the TextFields, validation works just fine. But how do I handle the fact that already entered and validated data can suddenly become invalid if the checkbox is clicked afterwards? How do I trigger the validation and the redraw (to show the error notification) of the TextFields from within an AjaxEvent from the checkbox?
I tried to call myTextField.validate() but that didn't trigger any of my validators.

Since your validation is based on multiple components you should implement IFormValidator. Pass both checkbox and textfield in getDependentFormComponents() and change of either will trigger it.
Also if you are using checkbox to refresh some elements make sure to use AjaxCheckbox, that has onUpdate(AjaxRequestTarget) method.

You could attach an AjaxFormSubmitBehavior in the checkbox. This would submit the form and trigger validation each time the checkbox value is toggled.

Related

Can you programmatically mark a validation observer as touched?

In my scenario I want to disable a save form button if the form has not been touched. I'm currently using v-slot="{ untouched }" on the validation-observer to achieve this. One of my checkboxes, however, is not wrapped in a validation provider. I.e., it's optional/not required. The problem is that whenever the checkbox value changes, my validation observer still has untouched set to true (assuming that's the only thing I've changed in the form). So I can't save my form even though I made a change to a boolean value. Is there a way where I can set my validation observer to istouched = true when my checkbox is changed? Or perhaps I need to manually check controls that have been changed that are not wrapped in a validation-provider tag.
FYI I'm using vee-validate 3.0

Vee-validate - Triggering field level validation only when $validator.validateAll() is called but not when the input field is touched

I have a scenario where a custom field validation rule to be triggered only when the submit button is clicked for that form and it should be triggered by calling $validator.validateAll() function itself. I don't want this rule to be triggered when I start making changes to the input field.
I have looked into .disable directive but looks it it will disable all the validation rules for that field which I don't want. I want to disable a specific validation rule and enable it later on the button click.
I am using vee-validate version 2.xx.
try dynamic validation in vee validate.
Dynamic Rules

MVC3 Want Clientside Validation to trigger for two fields when one of the two is modified

I am creating an MVC3 website and added a couple of security questions to the "My MVC Application" Registration routine in the form of dropdown boxes. I created a custom validator to check the second dropdown box and if the selected item is the same as the first then it shows an error message.
My problem is that the clientside validation triggers as soon as the second dropdown box loses focus. After the error is displayed, ideally, I should be able to change the selection in the first dropdown box and the validation error message for the second dropdown box should go away. But, of course, changing the first dropdown box does not trigger the clientside validation routine for the second dropdown box and the error does not go away.
I would appreciate it if someone who is well versed with the internalls of unobstrosive Ajax validation routines would guide me to a solution so that when the selection of one dropdown box changes the validation routine of both dropdown boxes is triggered.
Thanks a bunch for any pointers.
If you look at this question and my answer, you will see code for client-side validation where changing one field will trigger validation on another field, and will then stop after both fields' validation has run.

Selected Dropdown value changes when validation fails-ASP.NET MVC

I am using MVC 3 with ASP.NET. I have a dropdown box and getting it populated from database. I am using validation on the View. If it fails the validation, I am displaying the same view with errors being caught in ViewDate.ModelState.AddModelError.
I am checking for the ViewData.Modelstate.IsValid property if true then execute the code else display the errors in the view.
It is diplaying the errors in the page, but the selected value in the drop down is getting reset when validation fails.
How do I make sure the seleceted drop down does not change when validation fails?
In the action that handles the form submission and validation, make sure you set the properties on your model object from the form before rendering the form view.
For example, in this question you can see how the Dinner object parameter in the Create action is reused when the View() is returned.
Set a breakpoint in the action handling the submission and check the property for the list of values. If it's null or empty reload it.
If your dropdownlist is being populated via javascript then it is possible that the property holding the list of values is empty on submission. This is common when using cascading dropdownlists such is the case with loading Province / State lists based off country. All cascading lists loaded after the model has been passed to the view must be reloaded using the selected value of for each dropdownlist in the controller action that is handling the submission.

ASP.NET MVC 3.0 - User Hammering Submit Button

Even using the Post/Redirect/Get method, and including javascript to disable a button after it has been clicked, I am having a problem with users being able to just rapidly hammer a submit button and get multiple form posts in before server side validation can stop it.
Is there any way to stop this? I've even tried this method : how to implment click-once submit button in asp.net mvc 2?
And I've tried outright blocking the UI with jquery blockUI. I have BOTH client side and server side validation in place, and they work perfectly - but a user smashing the submit button twenty times in under a second just seems to keep breaking it.
Use javascript to wire the onclick event to disable the button.
If you are already doing that and you can still get multiple form posts, then the problem is a delay between the clicking of the button and the button being disabled, and you must be submitting the form multiple times during this delay.
To fix this, make the onclick event first make a call to stopPropagation() to stop the submit event. Then validate that the form is not in submission-blocked state. You can do this by creating a page-scoped javascript variable with a boolean value like can_submit. Test for can_submit being true before submitting the form. Set the can_submit = false when the button is disabled, so even if the button is not disabled fast enough, the form will not submit if the value has already been set to false.
In most cases I'd say that this isn't worth fixing - if a user is going to do something as silly as clicking submit 20 times they should expect to get an error.
The only real fix for this is to set up your action to only accept the same form once - add a hidden field that is set to a random value when the form is loaded. When the form is posted, save that value somewhere temporarily and if it is already there you have a duplicate request that shouldn't do anything.

Resources