65.9K
CodeProject is changing. Read more.
Home

AJAX Required Field Validator

emptyStarIconemptyStarIconemptyStarIconemptyStarIconemptyStarIcon

0/5 (0 vote)

Oct 11, 2013

CPOL

1 min read

viewsIcon

11531

Ajax ValidatiorIn this Article I'll Show you How to call a RequiredFieldValidator With the aid of AJAX.Step1:- In this case,there are three controls

Ajax Validatior


In this Article I'll Show you How to call a RequiredFieldValidator With the aid of AJAX.


Step1:- In this case,there are three controls in .aspx page

1.TextBox(txtfname)
2.Label (lblmsg) :-To show the Error Message.
3.and a Button(btnshow
 
 
 
 <asp:TextBox ID="txtfname" runat="server"></asp:TextBox>
 <asp:Label ID="lblmsg" runat="server" Text="Please Enter your First Name" Style="color: #ff0000; display:none;"></asp:Label>
   <input id="btnshow" type="button" onclick="ShowValdidator()" value="Enter" />



Note:-  Here We set the style of Label(lblmsg) :- display:none :-means the label is not display.


Here We call the function ShowValdidator() on the onclick event of btnshow,by this we check the TextBox value and call the Label(error meassage)




Step2: Call Function (ShowValdidator()):

In the <head> part write the folowing code:-


<script language="JavaScript" type="text/javascript" >

var xmlHttp

var arr;

function ShowValdidator()

{


xmlHttp=GetXmlHttpObject()

var url="Default.aspx"

url=url+"?fname="+document.getElementById('txtfname').value

xmlHttp.onreadystatechange=stateChanged 

xmlHttp.open("GET",url,true)

xmlHttp.send(null)

return false;

}

function stateChanged() 


if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")


      var str;

      str = xmlHttp.responseText;

      if(str=="")
      {
        document.getElementById("lblmsg").style.display='';

      }
      else
      {
         document.getElementById("lblmsg").style.display='none';
      }
      
}

}      

function GetXmlHttpObject()


var objXMLHttp=null

if (window.XMLHttpRequest)

{

objXMLHttp=new XMLHttpRequest()

}

else if (window.ActiveXObject)

{

objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")

}

return objXMLHttp


 </script>





Step 3:- In behind code (C#) :-


protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            if (Request.QueryString["fname"] != null)
            {

                string fname = Request.QueryString["fname"];

                Response.Clear();

                string str = fname.ToString();
                Response.Write(str);

                Response.End();

            }
        }
    }