VAAALID

Textbox validation
<html>
<head>
<script type="text/javascript">
function validation()
{
var a = document.form.name.value;
if(a=="")
{
alert("Please Enter Your Name");
document.form.name.focus();
return false;
} }
</script></head><body>
<form name="form" method="post" onsubmit="return validation()">
<tr>
<td> Your Name:</td>
<td><input type="text" name="name""></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="sub" value="Submit"></td>
</tr></form></body></html>
Password Validation
<html><head>
{
var a = document.form.pass.value;
if(a=="")
{
alert("Please Enter Your Password");
document.form.pass.focus();
return false;
}
if ((a.length < 4) || (a.length > 8))
{
alert("Your Password must be 4 to 8 Character");
document.form.pass.select();
return false;
} }
</script>
</head><body>
<tr><td> Passsword:</td>
<td><input type="password" name="pass""></td>
</tr>
<tr><td></td><td><input type="submit" name="sub" value="Submit"></td>
</tr>
</form></body>
</html>
1
Textarea Validation
<html>
<head>
{
var a = document.form.address.value;
if(a=="")
{
alert("Please Enter Your Details Here");
document.form.address.focus();
return false;
}
}
</script></head><body>
<tr>
<td> Address:</td>
<td><textarea name="address" cols="30" rows="4"></textarea></td>
</tr>
<tr><td></td><td><input type="submit" name="sub" value="Submit"></td>
</tr></form></body></html>
Radio button Validation
<html>
<head>
<script LANGUAGE="JavaScript">
function ValidateForm(form){
ErrorText= "";
if ( ( form.gender[0].checked == false ) && ( form.gender[1].checked ==
false ) )
{
alert ( "Please choose your Gender: Male or Female" );
return false;
}
if (ErrorText= "") { form.submit() }
}
</script>
</head>
<body>
<form name="feedback" action="#" method=post>
Your Gender: <input type="radio" name="gender" value="Male"> Male
<input type="radio" name="gender" value="Female"> Female
<input type="button" name="SubmitButton" value="Submit"
onClick="ValidateForm(this.form)">
<input type="reset" value="Reset">
</form>
</body>
</html>
2
Checkbox validation:
<html>
<head>
function ValidateForm(form){
ErrorText= "";
if ( ( form.gender[0].checked == false ) && ( form.gender[1].checked ==
false ) )
{
alert ( "Please choose your Gender: Male or Female" );
return false;
}
if (ErrorText= "") { form.submit() }
}
</script>
</head>
<body>
<form name="feedback" action="#" method=post>
Your Gender: <input type="radio" name="gender" value="Male"> Male
<input type="checkbox" name="gender" value="Female"> Female
<input type="checkbox" name="SubmitButton" value="Submit"
onClick="ValidateForm(this.form)">
<input type="reset" value="Reset">
</form> </body></html>
Select validation
<html><head>
{
if(document.login.type.selectedIndex==0)
{ alert("Please select your member type");
document.login.type.focus();
return false;
}
return true;
}
</script>
</head>
<body>
<form name="login" method="post" action="#" onsubmit="return
validation();">
<select name="type" class="texta1">
<option name="sel" value="Selected">Select Type</option>
<option name="fr" value="Freshers">Freshers</option>
<option name="ex" value="Experienced">Experienced</option>
<option name="un" value="Under_Studying">Under_Studying</option>
</select></form> </body></html>
3
Email validation
<script>
function validateemail()
{
var x=document.myform.email.value;
var atposition=x.indexOf("@");
var dotposition=x.lastIndexOf(".");
if (atposition<1 || dotposition<atposition+2 || dotposition+2>=x.length){
alert("Please enter a valid e-mail address \n atpostion:"+atposition+"\n dotposition:"+dotposi
tion);
return false;
}
}
</script>
<body>
<form name="myform" method="post" action="#" onsubmit="return validateemail();">
Email: <input type="text" name="email"><br/>
<input type="submit" value="register">

</form>
Name and password
<script>
function validateform(){
var name=document.myform.name.value;
var password=document.myform.password.value;
if (name==null || name==""){
alert("Name can't be blank");
return false;
}else if(password.length<6){
alert("Password must be at least 6 characters long.");
return false;
} }
</script>
<body>
<form name="myform" method="post" action="abc.jsp" onsubmit="return validateform()" >
Name: <input type="text" name="name"><br/>
Password: <input type="password" name="password"><br/>
<input type="submit" value="register"> </form>
4
Entire form validation
<html>
<html>
<head>
<title>ThaiCreate.Com Tutorials</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-
8"></head>
<body>
<script language="javascript">
function fncSubmit()
{
if(document.form1.txtUsername.value == "")
{
alert('Please input Username');
document.form1.txtUsername.focus();
return false;
}
if(document.form1.txtPassword.value == "")
{
alert('Please input Password');
document.form1.txtPassword.focus();
return false;
}
if(document.form1.txtConPassword.value == "")
{
alert('Please input Confirm Password');
document.form1.txtConPassword.focus();
return false;
}
if(document.form1.txtPassword.value !=
document.form1.txtConPassword.value)
{
alert('Confirm Password Not Match');
document.form1.txtConPassword.focus();
return false;
}
if(document.form1.txtName.value == "")
{
alert('Please input Name');
document.form1.txtName.focus();
return false;
}
document.form1.submit();
}
</script>
<form name="form1" method="post" action="save_register.php"
OnSubmit="return fncSubmit();">
Register Form <br>
5
<table width="400" border="1" style="width: 400px">
<tbody>
<tr>
<td width="125"> Username</td>
<td width="180">
<input name="txtUsername" type="text" id="txtUsername"
size="20">
</td>
</tr>
<tr>
<td> Password</td>
<td><input name="txtPassword" type="password" id="txtPassword">
</td>
</tr>
<tr>
<td> Confirm Password</td>
<td><input name="txtConPassword" type="password"
id="txtConPassword">
</td>
</tr>
<tr>
<td> Name</td>
<td><input name="txtName" type="text" id="txtName"
size="35"></td>
</tr>
<tr>
<td> Status</td>
<td>
<select name="ddlStatus" id="ddlStatus">
<option value="ADMIN">ADMIN</option>
<option value="USER">USER</option>
</select>
</td> </tr> </tbody> </table>
<br> <input type="submit" name="Submit" value="Save">
</form></body></html>
display_images_onmouseover
<html>
<head>
<title>ThaiCreate.Com Tutorial</title>
</head><body>
<form name="frmMain" action="" method="post">
<script language="JavaScript">
function showImg(imgsrc)
{
document.frmMain.imgAvatar.src=imgsrc;
}
</script>
6
<a href="" OnMouseOver="javascript:showImg('plakrim.jpg');"><img
src="plakrim.jpg" width="40"></a> <br>
<a href="" OnMouseOver="javascript:showImg('win.jpg');"><img src="win.jpg"
width="40"></a>
<hr><img id="imgAvatar"></form></body></html>
Create/Remove/Delete Dynamic Table Rows

<html>
<head>
</head>
<body>
function
addRow(strCustomerID,strName,strEmail,strCountryCode,strBudget,strUsed)
{
if (!document.getElementsByTagName) return;
tBody=document.getElementsByTagName("tbody").item(0);
//*** New Row ***//

NewRow=document.createElement("tr");
//*** Cell CustomerID ***//

cellCustomerID = document.createElement("td");
nodeCustomerID=document.createTextNode(strCustomerID);
cellCustomerID.appendChild(nodeCustomerID);
NewRow.appendChild(cellCustomerID);
//*** Cell Name ***//

cellName = document.createElement("td");
nodeName=document.createTextNode(strName);
cellName.appendChild(nodeName);
NewRow.appendChild(cellName);
//*** Cell Budget ***//

cellEmail = document.createElement("td");
nodeEmail=document.createTextNode(strEmail);
cellEmail.appendChild(nodeEmail);
NewRow.appendChild(cellEmail);
//*** Cell Country Code ***//

cellCountryCode = document.createElement("td");
nodeCountryCode=document.createTextNode(strCountryCode);
cellCountryCode.appendChild(nodeCountryCode);
NewRow.appendChild(cellCountryCode);
//*** Cell Budget ***//

cellBudget = document.createElement("td");
nodeBudget=document.createTextNode(strBudget);
cellBudget.appendChild(nodeBudget);
NewRow.appendChild(cellBudget);
//*** Cell Used ***//
7
cellUsed = document.createElement("td");
nodeUsed=document.createTextNode(strUsed);
cellUsed.appendChild(nodeUsed);
NewRow.appendChild(cellUsed);
tBody.appendChild(NewRow);
}
</script>
</head>
<body>
<table width="600" border="1" id="mytable">
<tr>
<th width="91"> <div align="center">CustomerID </div></th>
<th width="98"> <div align="center">Name </div></th>
<th width="198"> <div align="center">Email </div></th>
<th width="97"> <div align="center">CountryCode </div></th>
<th width="59"> <div align="center">Budget </div></th>
<th width="71"> <div align="center">Used </div></th>
</tr>
</table>
<button onClick="addRow('C001','Win
Weerachai','win.weerachai@thaicreate.com','TH','1000000','600000');return
false;">Add Row</button>
</body>
</html>
create_dynamic_table2
<html>
<head>
</head>
<body>
function CreateSelectOption(ele)
{
var objSelect = document.getElementById(ele);
var Item = new Option("", "");
objSelect.options[objSelect.length] = Item;
var Item = new Option("Win Weerachai", "C001");
var Item = new Option("John Smith", "C002");
var Item = new Option("Jame Born", "C003");
var Item = new Option("Chalee Angel", "C004");
}
function CreateNewRow()
{
var intLine = parseInt(document.frmMain.hdnMaxLine.value);
intLine++;
8
var theTable = document.getElementById("tbExp");
var newRow = theTable.insertRow(theTable.rows.length)
newRow.id = newRow.uniqueID
var newCell
//*** Column 1 ***//

newCell = newRow.insertCell(0);
newCell.id = newCell.uniqueID;
newCell.setAttribute("className", "css-name");
newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\"
NAME=\"Column1_"+intLine+"\" ID=\"Column1_"+intLine+"\"
VALUE=\"\"></center>";
//*** Column 2 ***//

//*** Column 3 ***//

//*** Column 4 ***//

//*** Column 5 ***//

newCell.innerHTML = "<center><SELECT
NAME=\"Column5_"+intLine+"\"
ID=\"Column5_"+intLine+"\"></SELECT></center>";
//*** Create Option ***//

CreateSelectOption("Column5_"+intLine)
document.frmMain.hdnMaxLine.value = intLine;
}
function RemoveRow()
9
{
intLine = parseInt(document.frmMain.hdnMaxLine.value);
if(parseInt(intLine) > 0)
{
theTable = document.getElementById("tbExp");
theTableBody = theTable.tBodies[0];
theTableBody.deleteRow(intLine);
intLine--;
document.frmMain.hdnMaxLine.value = intLine;
}
}
</script>
<body>
<form name="frmMain" method="post">
<table width="445" border="1" id="tbExp">
<tr>
<td><div align="center">Column 1 </div></td>
<td><div align="center">Column 5 </div></td> </tr></table> <input
type="hidden" name="hdnMaxLine" value="0">
<input name="btnAdd" type="button" id="btnAdd" value="+"
onClick="CreateNewRow();">
<input name="btnDel" type="button" id="btnDel" value="-"
onClick="RemoveRow();">
</form>
</body>
</html>
10

VAAALID

Uploaded by

Copyright:

Available Formats

You might also like

VAAALID

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

VAAALID

Uploaded by

Copyright:

Available Formats

Textbox validation

Radio button Validation

<input type="submit" value="register">

Create/Remove/Delete Dynamic Table Rows

//* New Row *//

//* Cell CustomerID *//

//* Cell Name *//

//* Cell Budget *//

//* Cell Country Code *//

//* Cell Budget *//

//* Cell Used *//

//* Column 1 *//

//* Column 2 *//

//* Column 3 *//

//* Column 4 *//

//* Column 5 *//

//* Create Option *//

You might also like