how to use jquery validation for simple text boxes

Question

Akhil Mittal · Answer

http://www.c-sharpcorner.com/Blogs/5004/ @ Page Language ="C#" AutoEventWireup ="true" CodeBehind ="WebForm1.aspx.cs" Inherits ="WebApplication66.WebForm1" %> DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> html xmlns ="http://www.w3.org/1999/xhtml"> head runat ="server"> title > Validation Example using JQuery title > link rel ="stylesheet" href ="Styles/ValidationStyle.css" type ="text/css" /> script type ="text/javascript" src ="Scripts/jquery-1.3.2.js"> script > script type ="text/javascript" src ="Scripts/jquery-latest.js"> script > script type ="text/javascript" src ="Scripts/jquery.validate.js"> script > --this javascriptis used to show the message after valid statement.-- %> script type ="text/javascript"> jQuery.validator.setDefaults({ debug: true , success: "valid" }); ; script > --write the following javascript for passing the parameter for jquery-- %> script type ="text/javascript"> $(document).ready( function () { $( "#form1" ).validate({ rules: { = txtUserName.UniqueID %> : { minlength: 5, required: true }, = txtPassword.UniqueID %> : { minlength: 5, required: true }, = TextIdea.UniqueID %> : { //minlength: 5, required: true } }, messages: { = txtUserName.UniqueID %> :{ required: "Plaese enter your name" , minlength: "User name must be atleaet of 5 characters" }, = txtPassword.UniqueID %> :{ required: "Plaese enter your password" , minlength: "Password must be atleaet of 5 characters" }, = TextIdea.UniqueID %> :{ required: "Plaese enter your Ideas" , minlength: "Password must be atleaet of 5 characters" } } }); }); script > head > body > form id ="form1" runat ="server"> div > User name asp : TextBox ID ="txtUserName" runat ="server" Height ="21px" MaxLength ="5"> asp : TextBox > br /> br /> Password asp : TextBox ID ="txtPassword" runat ="server" TextMode ="Password" MaxLength ="5" > asp : TextBox > br /> br /> The Idea asp : TextBox ID ="TextIdea" runat ="server" TextMode ="MultiLine"> asp : TextBox > br /> br />            asp : Button ID ="btnSubmit" runat ="server" Text ="Submit" /> Css ( StyleSheet) File body { } #field { margin-left : .5em ; float : right ; } #field , label { float : left ; font-family : Arial, Helvetica, sans-serif ; font-size : small ; } br { clear : both ; } input { border : 1px solid black ; margin-bottom : .5em ; } input.error { border : 1px solid red ; } label.error { position : absolute ; background : url('unchecked.gif') no-repeat ; padding-left : 20px ; margin-left : .3em ; vertical-align : middle ; background-color : #FFEBE8 ; border : solid 1px red ; width : 170px ; } label.valid { /*position:inherit; background: url('checked.gif') no-repeat; display: block; width: 16px; height: 16px; border: none; vertical-align:top;*/ position : absolute ; background : url('checked.gif') no-repeat ; padding-left : 20px ; margin-left : .3em ; vertical-align : top ; background-color : #FFEBE8 ; border : none ; width : 0px ; height : 16px ; } or http://www.jquerybyexample.net/2012/12/jquery-to-check-all-textboxes-empty.html

Jignesh Trivedi · Answer

hi, you can also use data annotation for the validation Please refer http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-validation-to-the-model http://adventuresdotnet.blogspot.in/2009/08/aspnet-webforms-validation-with-data.html hope this will help you.

Abhay Shanker · Answer

you can also try xmlns ="http://www.w3.org/1999/xhtml"> head runat ="server"> script src ="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> script > script type ="text/javascript"> $(document).ready( function () { $( '#btnsubmit' ).click( function () { var uname = $( '#txtname' ).val(); if (uname == '' ) { alert( "Please Enter Name" ); } }); }); script > title > title > head > body > form id ="form1" runat ="server"> div > asp : TextBox runat ="server" ID ="txtname"> asp : TextBox > asp : Button ID ="btnsubmit" runat ="server" Text ="Submit" /> div > form > body > html >

Abhay Shanker · Answer

Check the url http://www.c-sharpcorner.com/Blogs/5004/textbox-validation-using-jquery.aspx

Khan Abrar Ahmed · Answer

Hi please refer the below link http://www.contentedcoder.com/2012/08/jquery-validation-groups-for-webforms.html http://www.brainbrushups.com/2013/10/validate-aspnet-text-box-control-using.html

how to use jquery validation for simple text boxes

Answers (5)