After a form is filled once, I blank out the form before filling it the next time (new conversation), but the borders remain red

Question

I have used webshims for html5 form validation in a single page app with multiple pagelets(divs). The forms are not submitted but local javascript is invoked after each conversation and collected data is posted . Next I iterate over all the fields and reset the values. Then I take the new user back to the first pagelet having first form for the new conversation. This time even after filling the correct values the border does not turn green. Note: However when we select the field and click outside the field without filling it. and then after filling the correct data border turns green. However when we tried to achieve it programmatically iterating over each field resetting it and using javascript focus method, that did not do the trick.

I am sure I must be missing some thing. would be able to point out what.

Regards Barman

Answer 1

I'm not sure, what you want to achieve. I would need to see some code. If you change the value programmatically you can update the validation ui with the event refreshvalidityui on the form field. If you want to reset the ui, you can either trigger a reset event on the form or resetvalidityui on the form field

$('input').val('foo').trigger('refreshvalidityui');

or

$('input').val('foo').trigger('resetvalidityui');

or

$('form').trigger('reset');

Please let me know, if this helps.