Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: Javascript HTML
hi there,
 
I am putting together a stand alone registration page. I want to use javascript to validate user inputs. I have the code below but doesn't seem to work, not sure if my connection to the html page is correct or not. Please could someone point me in the right direction on the following code:
 
<!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>
<link rel="stylesheet" type="text/css" href="StyleSheet.css"/></head>
<script type="text/javascript" src="javascript.js"></script>
 
<html>
    <body>
 
	<div id="form">
		<form name="registration" onsubmit="return validate" method="post">
			<h3>Registration Form</h3>
			<fieldset id="Logon">
				<legend>Create Logon</legend>
				
				<!-- add a class to all the input boxes instead. Safer and more backwards-compatible -->
                <div class="form-line">
				<label for="username">Username *: </label>
				<input type="text" id="Username" name="userid"/></div>
				
                <div class="form-line">
				<label for="pwd">Password *: </label>
				<input type="password" id="Password" name="pwd" /></div>
				
				<div class="form-line">
				<label for="pwd">Confirm Password *: </label>
				<input type="password" id="Confirm Password" name="confpwd"/></div>
				
				</fieldset>
 
javascript:
 
<script type="text/javascript">
function validate()
{
	//registration form function - field variables
	var userid = document.form["registration"]["userid"].value;
	var pwd = document.form["registration"]["pwd"].value;
	var confpwd = document.form["registration"]["confpwd"].value;
	var lastname = document.form["registration"]["lastname"].value;
	var fname = document.form["registration"]["fname"].value;
	var dob = document.form["registration"]["dob"].value;
	var email = document.form["registration"]["email"].value;
	var confemail = document.form["registration"]["confemail"].value;
	var tel = document.form["registration"]["tel"].value;
	var add1 = document.form["registration"]["add1"].value;
	var add2 = document.form["registration"]["add2"].value;
	var twnc = document.form["registration"]["twnc"].value;
	var ptc = document.form["registration"]["ptc"].value;
	
	
	var valid = true;
    
	var username=document.getElementById("userid");
		
		if(username.value=="")
		{
			alert("Please enter username");
			username.focus();
			return false;
		}
	var Password=document.getElementById("pwd");
		if(Password.value=="")
		{
		alert("Please enter Password");
		Password.focus();
		return false;
		}
	var rePassword=document.getElementById("confpwd");
		if(rePassword.value=="")
		{
		alert("Please re-enter password");
		rePassword.focus();
		return false;
		}
	var dob=document.getElementById("dob");
		if(dob.value=="")
		{
		alert("Please re-enter dob");
		dob.focus();
		return false;
		}
	var email=document.getElementById("email");
		if(email.value=="")
		{
		alert("Please re-enter email");
		email.focus();
		return false;
		}
	var cemail=document.getElementById("confemail");
		if(cemail.value=="")
		{
		alert("Please re-enter email");
		cemail.focus();
		return false;
		}
	var address=document.getElementById("add1");
		if(address.value=="")
		{
		alert("Please re-enter address");
		address.focus();
		return false;
		}
	var city=document.getElementById("twnc");
		if(city.value=="")
		{
		alert("Please re-enter town/city");
		city.focus();
		return false;
		}
	var post=document.getElementById("ptc");
		if(pin.value=="")
		{
		alert("Please re-enter Postcode");
		pin.focus();
		return false;
		}
}
</script>
 
Can someone check my connection to the html page please as well because it is not doing anything. Bare in mind i am new to building web pages. I want to try and validate all user inputs, I did not include the full html class by the way. If required i will do so.
 
Thanks in advance
Posted 20-Dec-11 1:20am
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

Where is the submit button in your form? that's the issue. Check this page
Form onsubmit Event[^] & its example[^]
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

hi,
try this way
 
html code
--------------------------------------------------------------------------
<pre lang="xml"><html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script src="javascript.js" type="text/javascript"></script>
</head>
<html>
<body>
    <form name="registration">
    <div>
        Username:<input type="text" name="Username" /><br />
        <br />
        Password:<input type="text" name="Password" /><br />
        <br />
        ConfirmPassword:<input type="text" name="ConfirmPassword" /><br />
        <br />
        <input type="button" value="Login" onclick="validate()" />
        <br />
        <br />
    </div>
    </form>
</body>
</html>
 
javascript.js
------------------------------------------------------------------
function validate() {
    if (document.registration.Username.value == 0) {
        alert("Enter username");
    }
 
    else if (document.registration.Password.value == 0) {
        alert("enter Password");
    }
    else if (document.registration.ConfirmPassword.value == 0) {
        alert("enter ConfirmPassword");
    }
    else {
 
        alert("Sucessfull Login");
    }
}
  Permalink  
Comments
Geofferz at 20-Dec-11 8:19am
   
Thanks mate!! works well
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 3

  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 Maciej Los 450
1 OriginalGriff 403
2 CPallini 189
3 Sergey Alexandrovich Kryukov 189
4 CHill60 180
0 OriginalGriff 6,092
1 Sergey Alexandrovich Kryukov 4,958
2 Maciej Los 3,269
3 Peter Leow 3,129
4 DamithSL 2,490


Advertise | Privacy | Mobile
Web03 | 2.8.140721.1 | Last Updated 20 Dec 2011
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100