I have a form where I use some field validations which shows messages if getting errors or corrects.At bottom there is a reset button to reset all previously input data and javascript messages also.My reset button cant be able to remove javascript messages from page.Can anyone guide me?
Code:
<?php /*?><?php
session_start();
include "config.php";
?><?php */?>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Kesoram Industries Limited | Corporate Relations Website</title>
<script language="javascript" type="text/javascript">
function checkEmail()
{
var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
var email = document.getElementById("email");
if(!email.value.match(emailExp))
{
document.getElementById("e").innerHTML = "<img src='wrong.png'/>";
email.focus();
}
else
{
document.getElementById("e").innerHTML = "<img src='right.png'/>";
}
}
function checkName()
{
var nameExp = /^[a-zA-Z]+$/;
var name = document.getElementById("name");
if(!name.value.match(nameExp))
{
document.getElementById("n").innerHTML = "<img src='wrong.png'/>";
name.focus();
}
else
{
document.getElementById("n").innerHTML = "<img src='right.png'/>";
}
}
</script>
<script language="javascript" src="check.js"></script>
<table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<form name="form1" id="form1" action="" method="post" onsubmit="return check();">
<table width="600" border="0" align="center" cellspacing="0">
<tr>
<td nowrap="nowrap" bgcolor="#CA6A13" class="mail-tablehead-rev"> Company :</td>
<td> </td>
<td nowrap="nowrap"> </td>
</tr>
<tr>
<td nowrap="nowrap" class="mail-l-new"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td nowrap="nowrap" class="mail-l-new">Department </td>
<td> </td>
<td> <label for="dept"></label>
<select name="country" class="mail-boxtext" id="Department" onChange="getCity(this.value)">
<option value=""selected>Select Department</option>
<option value="1">India</option>
<option value="2">USA</option>
<option value="3">Pakistan</option>
<option value="4">Australia</option>
</select></td>
<tr>
<td class="mail-l-new">Subject </td>
<td> </td>
<td ><div id="citydiv"><select name="city" class="mail-boxtext" id="Subject" >
<option>Select Department First</option>
</select></div></td>
</tr>
<tr>
<td nowrap="nowrap" class="mail-l-new">Folio No./DP ID</td>
<td> </td>
<td><input type="text" name="foliono" id="foliono" onmouseover="showhint('Please enter a Folio No. Should be in proper format.', this, event, '150px')" onblur="check_input()" size="40" maxlength="100" length="100" class="mail-boxtext"/></td>
<td id="id"> </td>
</tr>
<tr>
<td class="mail-l-new">Client ID</td>
<td> </td>
<td><input type="text" name="clientid" id="clientid" onmouseover="showhint('Please enter a Client Id.', this, event, '150px')" onFocus="checkNumber()" onblur="check_input()" size="40" maxlength="100" length="100" class="mail-boxtext"/></td>
<td id="id1"> </td>
</tr>
<!--<tr>
<td class="mail-l-new"> </td>
<td class="mail-tablehead-revCopy"> </td>
<td class="mail-tablehead-revCopy"><font><span class="mail-text-small">For queries related to <strong>Share Department</strong>, Folio No. / DP ID and Client ID is mandatory. Incase of other queries it should be given as Not Applicable.</span></font></td>
</tr>-->
<tr>
<td bgcolor="#CA6A13" class="mail-tablehead-rev"> Details :</td>
<td class="mail-tablehead-revCopy"> </td>
<td class="mail-tablehead-revCopy"> </td>
</tr>
<tr>
<td valign="top" class="mail-l-new">Name </td>
<td> </td>
<td><input name="name" type="text" class="mail-boxtext" id="name" onblur="check_input()" onfocus="checkClientid()" size="50" maxlength="100" length="100" onmouseover="showhint('Please enter a Name. Should be in proper format.', this, event, '150px')"/></td>
<td id="n"> </td>
</tr>
<tr>
<td valign="top" class="mail-l-new">Address </td>
<td valign="top"> </td>
<td valign="top" class="mail-text"><textarea name="address" cols="50" rows="5" class="mail-boxtext" id="address" onFocus="checkName()" onblur="check_input()" onmouseover="showhint('Please enter an Address.', this, event, '150px')"></textarea></td>
<td id="id2"> </td>
</tr>
<tr>
<td valign="top" class="mail-l-new">Email </td>
<td valign="top"> </td>
<td><input name="email" type="text" class="mail-boxtext" id="email" onblur="check_input()" onfocus="checkAddress()" size="40" maxlength="100" onmouseover="showhint('Please enter an Email Id. Should be in proper format.', this, event, '150px')"/></td>
<td id="e"> </td>
</tr>
<tr>
<td valign="top" class="mail-l-new">Contact No. </td>
<td valign="top"> </td>
<td><input name="phone" type="text" class="mail-boxtext" id="phone" onFocus="checkEmail()" onblur="check_input()" size="40" maxlength="100" onmouseover="showhint('Please enter a 10 digit Phone No.', this, event, '150px')"/></td>
<td id="id3"> </td>
</tr>
<tr>
<td valign="top" bgcolor="#CA6A13" class="mail-tablehead-rev"> Query:</td>
<td rowspan="2" valign="top"> </td>
<td> </td>
</tr>
<tr>
<td valign="top" class="mail-l-new"> </td>
<td><!--<script language = "Javascript">
maxL=1000;
var bName = navigator.appName;
function taLimit(taObj) {
if (taObj.value.length==maxL) return false;
return true;
}
function taCount(taObj,Cnt) {
objCnt=createObject(Cnt);
objVal=taObj.value;
if (objVal.length>maxL) objVal=objVal.substring(0,maxL);
if (objCnt) {
if(bName == "Explorer"){
objCnt.textContent=maxL-objVal.length;}
else{objCnt.innerText=maxL-objVal.length;}
}
return true;
}
function createObject(objId) {
if (document.getElementById) return document.getElementById(objId);
else if (document.layers) return eval("document." + objId);
else if (document.all) return eval("document.all." + objId);
else return eval("document." + objId);
}
</script>--><font><!--<span class="mail-text-small"> Maximum characters for this text box is 1000.</span><br>-->
<textarea name="message" cols=50 rows=8 wrap="physical" class="mail-boxtext" id="message" onfocus="checkPhno()">
</textarea>
<br>
<!--<span class="mail-text-small">You have <B><SPAN id=myCounter>1000</SPAN></B> characters remaining
for your message.</span>--></font></td>
<td id="id4"> </td>
</tr>
<tr>
<td> </td>
<td class="code-text"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td class="code-text"> </td>
<td><input type="submit" name="submit" id="submit" value="Preview"/> <input type="hidden" id="sub" />
<input type="reset" name="reset" id="reset" value="Reset" onclick="document.form1.reset();return false;"/> </td>
</tr>
</table>
</form></td>
</tr>
</table>
</div>
</body>
</html>
Comment