Using Javascript to validate data entered.

M

mike55

Contributor
Joined
Mar 26, 2004
Messages
727
Location
Ireland
Hi all

I am attempting to use javascript to validate the data submitted by the user. I have a single textbox, a custom validator, and a validation summary control on my page.

User should be able to place a numeric value in the textbox (I'm ignoring alpha characters at the moment), if the value is between 2 and 3, then the value is correct, otherwise I want to set the custom validator to false and display the error message in the validation summary.

I have succeed in displaying the error in a javascript alert box, but I am unsure on how to move on with the custom validator.

Here is the code I am using so far...
Code: 
function ValidateData(){
  var data = document.getElementById("TextBox1");
  if (data.value < 1 || data.value > 3){
    alert("Invalid Data");
  }
  else{
    return true;
  }
}

Mike55.
 
Well, if you want to validade a textbox with values between 2 and 3 u can use a RangeValidator. It comes something like this

Code: 
<asp:textbox id="textbox1" runat="server"/>
<asp:RangeValidator id="valRange" runat="server"
    ControlToValidate="textbox1"
    MaximumValue="3"
    MinimumValue="2"
    Type="integer"
    ErrorMessage="* Only numbers between 2 and 3" Display="static">*</asp:RangeValidator>
 
rfazendeiro said:
Well, if you want to validade a textbox with values between 2 and 3 u can use a RangeValidator. It comes something like this

Code: 
<asp:textbox id="textbox1" runat="server"/>
<asp:RangeValidator id="valRange" runat="server"
    ControlToValidate="textbox1"
    MaximumValue="3"
    MinimumValue="2"
    Type="integer"
    ErrorMessage="* Only numbers between 2 and 3" Display="static">*</asp:RangeValidator>
Click to expand...

The range validator is grand, however I want to try and validate the majority of the user data on the client side. Unfortunately the level and type of broadband available to most in Ireland is limited, so the majority of people viewing the site are going to be using 56K dial-up. Therefore if I can use the javascript to validate all the data before the postback, I can make the site more accessible to users. I know that in some cases that I will have no alternative but to allow the postback, and I do not want to start dropping all sorts of validators around my page and setting the enableclientscript to true on them.

Mike55.
 
You can, with javascript, go through all the validatores that existe and see if they are valid. Here is the code.

First of all we need to add an atribute to the button so that he runs our javascript function. To do that just put this line in the InitializeComponent method

Code: 
Button1.Attributes.Add("onclick","CheckValidatorErrors();");

then before the HEAd tag just insert this javascript

Code: 
<script language="JavaScript" type="text/javascript">
function ValidatorUpdateDisplay(val) 
{
	if (typeof(val.display) == "string") 
	{    
		if (val.display == "None") 
		{
			return;
		}
		if (val.display == "Dynamic") 
		{
			val.style.display = val.isvalid ? "none" : "inline";
			return;
		}
	}
	val.style.visibility = val.isvalid ? "hidden" : "visible";
}

function CheckValidatorErrors() 
{ 
	for(i=0;i< Page_Validators.length;i++) 
	{
		if (!Page_Validators[i].isvalid)
		{
			Page_IsValid = false;
			ValidatorUpdateDisplay(Page_Validators[i]);
		}
	}
} 		 
</script>



the thing is i don't know if the server side code is executed idf you have this javascript code. Anyway hope this helps, at least to point you in a right direction
 
Back
Top