Question

I am pretty sure I am missing something very obvious but I am trying to validate my one of the textbox with required condition and I am using Jquery validator for that. My code looks like below:

 var validator = $("#ForgotPassword").validate({
                rules: {
                    EmailAddress: { required: true }
                },
                messages: {
                    EmailAddress: {
                        required: "Email address is required."
                    }
                }
            });

My DOm is like something below:

<form id = "ForgotPassword" class="ui-helper-hidden"  title="Forgot Password" action="" method="GET">
                <p>Please enter the email address you registered with. We’ll send you an email with a password reset link.</p>
                <div class="inputwrapper _100">
                    <label for="Email">Email</label>
                    <input type="text" id="EmailAddress" name="Email" data-bind ="value : ForgotPasswordEmailAddress"/>
                    <span id="EmailAddress_Error" class="ui-helper-hidden errorMessage" ></span>
                </div>
            </form>

But when I put a watch on my validator object on the run time, I do not see any error. Is is because I am looking at the wrong place or my binding are not right?

Answer 1

Try this please or paste rest of your validation code:

For validation plugin you need to have name – EmailAddress in this case:

Hope it help the cause :)

<form id = "ForgotPassword" class="ui-helper-hidden"  title="Forgot Password" action="" method="GET">
                <p>Please enter the email address you registered with. We’ll send you an email with a password reset link.</p>
                <div class="inputwrapper _100">
                    <label for="Email">Email</label>
                    <input type="text" id="EmailAddress" name="EmailAddress" class="EmailAddress" data-bind ="value : ForgotPasswordEmailAddress"/>
                    <span id="EmailAddress_Error" class="ui-helper-hidden errorMessage" ></span>
                </div>
            </form>