Question

I am building wizard step demo application with MVC3 and using razor view engine as begineer level.

I came across on problem with validation when hide & show control through javascript.

Please look my code section as per below

<div class="editor-field">
                @Html.EditorFor(model => model.CheckName2)
                @Html.ValidationMessageFor(model => model.CheckName2)
            </div>

my javascript function as per below, hide & show on some condition

// attach nextStep button handler       
        $("#next-step").click(function () {

            var $step = $(".wizard-step:visible"); // get current step

            //check if URL2 is having any content        
            var val = $("#URL2").val();
            if (val == "") {
                $("#CheckName2").hide();
                //want to remove validation here

            }
            else {

                $("#CheckName2").show();
                //want to add validation here

            }
 var validator = $("form").validate(); // obtain validator
        var anyError = false;
        $step.find("input").each(function () {


            if (!validator.element(this)) { // validate every input element inside this step

                anyError = true;
            }


        });

        if (anyError)
            return false; // exit if any error found

How can i handle validation here?

thanks in advance.

Answer 1

Force validation of your form with $(“#IdOfFormYouEdit”).validate(); or $(“#IdOfTextbox”).validate(); to validate only one element.

This is possible if you have put validation attributes on your view model classes. If you don’t you can add validation on an element by adding the data-val attributes. For example:

<input type="text" data-val="true" data-val-number="The field someField must be a number." data-val-required="SourceId required" />