locked
Error Messages RRS feed

  • Question

  • User-1499457942 posted

    Hi

      How to control Validation error messages and what is the best way to display 

    Thanks

    Tuesday, October 9, 2018 3:51 PM

All replies

  • User2103319870 posted

    Hi

      what is the best way to display 

    Thanks

    If you are using inbuild asp.net validation controls. then one best option to use Validation Summary Control

    http://www.informit.com/articles/article.aspx?p=516589&seqNum=7

    Tuesday, October 9, 2018 3:59 PM
  • User-893317190 posted

    Hi JagjitSingh,

    You could also use jquery validation .

    It will control the presentation of error message.

    When click the button to submit, it will validate the controls and show the error messages.

    After that , whenever you enter words in the textbox, it will validate the control to decide whether to show or hide the error message.

    You could control the place to show the error message by providing the error label for the control to validate.

    You could also control the style of error message because all the error message have a class named "error".

    Below is a small sample. Normally the error message is shown on the next line of the control.

     <style>
    
            .error{
                color:red
            }
        </style>
        <script src="../Scripts/jquery-3.3.1.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js"></script>
    </head>
    <body>
        <form id="form1" runat="server">
    
         <asp:Label ID="Label1" runat="server" Text="firstName:" ></asp:Label>   <asp:TextBox ID="firstName" runat="server"></asp:TextBox>
           <div> <label  class="error" for='<%=firstName.UniqueID %>'></label></div>   <%--for should be the control's uniqueId --%>
           <asp:Label ID="Label2" runat="server" Text="lastName:" ></asp:Label>&nbsp;   <asp:TextBox ID="lastName" runat="server"></asp:TextBox>
            <div> <label  class="error" for='<%=lastName.UniqueID %>'></label></div>
              <asp:Label ID="Label3" runat="server" Text="userName:" ></asp:Label>  <asp:TextBox ID="userName" runat="server"></asp:TextBox>
            <div> <label  class="error" for='<%=userName.UniqueID %>'></label></div>
             <asp:Label ID="Label4" runat="server" Text="password:" ></asp:Label>&nbsp;  <asp:TextBox ID="password" runat="server" TextMode="Password"></asp:TextBox>
            <div> <label  class="error" for='<%=password.UniqueID %>'></label></div>
            <asp:Button ID="Button1" runat="server" Text="submit" />
        </form>
    
    
       <script>
           $(function () {
    
    $('#form1').validate(
    
               {
        rules: {
         <%=firstName.UniqueID%> : "required",  //please use UniqueId of the control to add rule to the control
           <%=lastName.UniqueID%>: "required",
           <%=firstName.UniqueID%>: {
            required: true
            
          },
           <%=userName.UniqueID%>: {
            required: true,
            minlength: 3
          },
          <%=password.UniqueID%>: {
            required: true,
            minlength: 6
          }
        },
        messages: { //error messages  to show for the control
           <%=firstName.UniqueID%>: "please enter your firstname",
        <%=lastName.UniqueID%>: "please enter your lastname",
           <%=userName.UniqueID%>: {
            required: "username is required",
            minlength: "username should have more than two characters"
          },
       <%=password.UniqueID%>: {
            required: "plaese enter password",
            minlength: "password should have more than 5 characthers"
          }
         }
               }
           )
    
    
           })
    
           
    
       </script>

    The result.

    For more information about jquery validation , please refer to https://jqueryvalidation.org/

    Best regards,

    Ackerly Xu

    Wednesday, October 10, 2018 5:33 AM