Member Avatar for erum

I have .aspx form and I wanted to put jquery validation over it ..some validation already been working like
minlength: "Your password must be at least 5 characters long written in code attached ..I want for first name and last name too for 5 characters ..

Please reply

<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="Farmerinfo.aspx.cs" Inherits="LandManagment.Farmerinfo" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

    <script src="lib/jquery.js"></script>
<script src="js/jquery.validate.js"></script>

<script>
    $.validator.setDefaults({
        submitHandler: function () { alert("submitted!"); }
    });

    $().ready(function () {
        // validate the comment form when it is submitted
     //   $("#commentForm").validate();

        // validate signup form on keyup and submit
        $("#signupForm").validate({
            rules: {
                firstname: "required",
                minlength: 5,
                lastname: "required",
                username: {
                    required: true,
                    minlength: 2
                },
                password: {
                    required: true,
                    minlength: 5
                },
                confirm_password: {
                    required: true,
                    minlength: 5,
                    equalTo: "#password"
                },
                email: {
                    required: true,
                    email: true
                },
                topic: {
                    required: "#newsletter:checked",
                    minlength: 2
                },
                agree: "required"
            },
            messages: {
                firstname: "Please enter your firstname",
                lastname: "Please enter your lastname",
                username: {
                    required: "Please enter a username",
                    minlength: "Your username must consist of at least 2 characters"
                },
                password: {
                    required: "Please provide a password",
                    minlength: "Your password must be at least 5 characters long"
                },
                confirm_password: {
                    required: "Please provide a password",
                    minlength: "Your password must be at least 5 characters long",
                    equalTo: "Please enter the same password as above"
                },
                email: "Please enter a valid email address",
                agree: "Please accept our policy"
            }
        });

        // propose username by combining first- and lastname
        $("#username").focus(function () {
            var firstname = $("#firstname").val();
            var lastname = $("#lastname").val();
            if (firstname && lastname && !this.value) {
                this.value = firstname + "." + lastname;
            }
        });

        //code to hide topic selection, disable for demo
        var newsletter = $("#newsletter");
        // newsletter topics are optional, hide at first
        var inital = newsletter.is(":checked");
        var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
        var topicInputs = topics.find("input").attr("disabled", !inital);
        // show when newsletter is checked
        newsletter.click(function () {
            topics[this.checked ? "removeClass" : "addClass"]("gray");
            topicInputs.attr("disabled", !this.checked);
        });
    });
</script>

     <div id="main">

<form   id="signupForm" method="get" action="">

  <div id="header">
            <h1>farmer input form</h1>
        </div>
        <table >
        <tr>
            <td>Farmer firstName</td>
            <td><input id="Text1" name="firstname" type="text" /></td>
        </tr>
        <tr>
            <td>Farmer LastName</td>
            <td><input id="Text2" name="lastname" type="text" /></td>
        </tr>
        <tr>
            <td>Land Area</td>
            <td><input id="password1" name="password" type="password" /></td>
        </tr>
        <tr>
            <td colspan="2"><input class="submit" type="submit" value="Submit"/></td>

        </tr>

    </table>


</form>


</div>
</asp:Content>
  • 2 Contributors
  • 1 Reply
  • 281 Views
  • 2 Minutes Discussion Span
  • Latest Post Latest Post by pritaeas

Dani AI

Generated

Short answer: put the minlength rule inside each field's rule object and make sure the rule names match the form input name (jQuery Validate maps rules by name). In the posted rules the minlength: 5 is at the wrong level, and a few rule names/selectors don't match the inputs in the form — tidy those up.

Example (only the that part changed):

$("#signupForm").validate({
  rules: {
    firstname: { required: true, minlength: 5 },
    lastname:  { required: true, minlength: 5 }
  }
});

Also check these common mismatches that stop validation from working: equalTo must point to an element that actually exists (if you use equalTo: "#password" your password input must have id="password"), remove or fix rules for fields that aren't present (there are username rules but no corresponding input), and make sure you include jquery.js before jquery.validate.js. Use the browser console for script errors — a missing selector or a JS error will prevent the plugin from running.

As suggested, copying the password rule pattern to the firstname/lastname fields is the right approach — just place minlength inside each field's rule object and ensure name/id values in the HTML match the selectors used by the rules.

Member Avatar for pritaeas

Just copy what's set for password, to username and lastname.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.