Clientside validation - Dev Articles

Dev Articles Community Forums Sponsor:

April 29th, 2003, 10:15 AM

joekske

Junior Member

Join Date: Mar 2003

Posts: 9

Time spent in forums: < 1 sec
Reputation Power: 0

Clientside validation

Hi

I have made a simple form: 3 textboxs, a imagebutton and calender.
The calender becomes visible when you click on the imagebutton. You select a date and this date comes in textbox1. the 2 other textboxs you can fill in whatever you want. Now i want to validate if the 3 textboxs are filled in. If there is an empty textbox, i want to show a messagebox.

I have tried to use validation controls but when you click on the imagebutton the form is postbacked. Also when you select a date from the calender the form is postbacked.

I see only one solution and this is to work whit javaScript to validate the 3 textboxs but i can't seem to get the text attribute from a textbox in javaScript.

Can onyone help me?
If you think of a way to validate this form serverside even better.

thanks

joekske

April 29th, 2003, 10:58 AM

jpenn

Contributing User

Join Date: Oct 2002

Location: Washington, DC

Posts: 317

Time spent in forums: 2 m 3 sec
Reputation Power: 7

Well, your best option is to validate both ways - client and server side. So, use javascript to pop your message on the user if the fields are not filled in but also validate it server side with php.

Whats your code look like - the jscript you are having problems with?

__________________
~ Joe Penn

We work for free to help make this a valuable resource on the internet. Do you appreciate the help - did we provide help that will help you prosper and help that has contributed to sharpening your current skill set?

Show your appreciation and purchase something from our Amazon Wishlist's - it's simple and a great way to say thank you.

April 29th, 2003, 11:35 AM

MadCowDzz

I'm Internet Famous

Dev Articles Frequenter (2500 - 2999 posts)

Join Date: Jan 2003

Location: Toronto, Canada

Posts: 2,890

Time spent in forums: 1 Week 16 h 14 m 9 sec
Reputation Power: 8

I'm curious as to how you're displaying a calender... perhaps you could provide a link, or your code, to reveal a peek at what you're doing.

As for your textboxes, it's the value attribute in javascript...

Quick example:

Code:

if (document.form.textbox1.value=="whatever") {
  alert("Whatever!");
}

Depending on what's going into your text boxes, you might want to consider Regular Expressions to validate the fields.

Quick example for validating email address

Code:

var r, re;
var email = document.form1.email;

re=/[a-zA-Z].\@.[a-zA-Z]/;
if(r=re.exec(email.value)) {
  alert("Valid email");
} else {
  alert("Invalid email:\nuser@host.com");
}

I hope some of this helps... i strongly agree with jpenn too, serverside validate as well... keeps invalid data out of your database.

April 30th, 2003, 02:35 AM

joekske

Junior Member

Join Date: Mar 2003

Posts: 9

Time spent in forums: < 1 sec
Reputation Power: 0

Code

here is the code

ps: if (document.form.textbox1.value=="whatever") {
alert("Whatever!");
}
doesn't work

c u

joekske

Attached Files

code.txt (5.5 KB, 356 views)

April 30th, 2003, 08:46 AM

jpenn

Contributing User

Join Date: Oct 2002

Location: Washington, DC

Posts: 317

Time spent in forums: 2 m 3 sec
Reputation Power: 7

Try:

Code:

function checkValues()
{
	if ( document.getElementById( 'textfield' ).value == '' )
	{
		alert('Empty!');
	}
	
}
</script>
</head>

<body>
<form name="form" method="post" action="">
    <input type="text" name="textfield"><br />
    <input type="submit" name="Submit" value="Submit" onclick="checkValues()">
</form>

Just run that as is and see if that is what you are looking for. If it is, use it as a starting point...

May 1st, 2003, 06:57 AM

Ben Rowe

Guest

Posts: n/a
Time spent in forums:
Reputation Power:

when I use javascript to valididate a form, i use something like this

PHP Code:


		
			
<script language="javascript">



function CheckForm()

{



var frm = document.frm;



if(frm.field_name.value == '')

{



alert('You must provide some data for field name;

frm.field_name.focus();

frm.field_name.select();

return false;



}



return true;



}



</script>



<form method="post" action="file.html" name="frm" onSubmit="return CheckForm();">

<input name="field_name" type="text" value="">

<input type="submit">

</form>

Basically it just goes though the list, if theres a problem it returns false, and the form is not submitted, other wise it submit the form.

Thread Tools	Search this Thread
Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread: