Question

I’m using MVC 3 with Razor and using unobtrusive client validation. Things are working great, but I want to be able to reset the form if a user decides he wants to start over or cancel his action. It seems that there is a lot of meta data attached to each form element when using the validation.

<input type="text" value="" name="User.FirstName" id="User_FirstName" data-val-required="The First Name field is required." data-val-length-max="50" data-val-length="The field FirstName must be a string with a maximum length of 50." data-val="true" class="text-box single-line">

The jQuery snippet here shows my problem. When you try to manually reset the value of the text field, some other javascript is intercepting execution after I clear the value and it sets it back to what it was:

       $("#btnReset").click(function () {
        alert($("#User_FirstName").val());
        $("#User_FirstName").val("");
        alert($("#User_FirstName").val());
       });

I’m looking for pointers here on how to clear form values when a user clicks a button. It seems like such a simple task, but I can find no documentation how to accomplish this and I haven’t found anything here or elsewhere to help.

Answer 1

I was using an html input of type reset rather than the button type. The reset should not have been used in this case.