When i added <form> to my web page, all my javascript stopped working, and when i put the form at the begining of my table submit wont work, what i am doing wrong. below is my code after testing on other browser it works fine but on Firefox it doesn’t
Update: After checking on firefox java error console it appears that Checking Function is defined
Update2: Solved my mistake was <script type="text/jscript"> is wrong thats why on firefox it wasn’t working and on the rest it was, it must be <script type="text/javascript">
<!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=utf-8" />
<title>Sabay Afrah.Inc | Contact Us</title>
<script src="js/clear.js" language="javascript" type="text/javascript"></script>
<script src="js/SpryValidationSelect.js" type="text/javascript"></script>
<script type="text/jscript">
function Checking(form){
if(empty(form.fname.value){
alert("do nothing");
}
}
</script>
<style type="text/css">
<!--
body {
background-color: #000;
}
body,td,th {
color: #FFF;
font-size: 14px;
}
.address {
font-family: "Comic Sans MS", cursive;
font-weight: bold;
}
-->
</style>
<link href="theme/style.css" rel="stylesheet" type="text/css" />
<link href="theme/SpryValidationSelect.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form action="enterdb.php" method="post">
<table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center"> </td>
</tr>
<tr>
<td><table width="1006" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="4"> </td>
<td width="93" align="right"> </td>
<td width="4"> </td>
<td width="374" ><img src="images/logo.png" width="230" height="114" /></td>
<td width="426" align="right" class="address">
10 GlenLake parkway<br />
Suite 130, mailbox # 76<br />
Atlanta, GA 30328<br />
Phone #: + 678-222-3442<br />
Fax #: +678-222-3401<br />
Office hours: M-F 8:30 a.m. to 5:00 p.m.<br />
</td>
<td width="99"> </td>
</tr>
<tr>
<td colspan="5"><table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
<td class="title"> </td>
</tr>
<tr>
<td width="84"><br /></td>
<td width="516" class="title">Contact Us</td>
</tr>
</table></td>
<td> </td>
</tr>
</table></td>
</tr>
<tr>
<td>
<table width="883" border="0" align="center" cellpadding="0" cellspacing="0">
<tr class="table">
<td width="27" rowspan="10" bgcolor="#330099" class="textable"> </td>
<td colspan="2" bgcolor="#330099" class="textable"> </td>
<td width="29" rowspan="8" bgcolor="#330099" class="textable"> </td>
<td colspan="3" class="textable"> </td>
</tr>
<tr >
<td width="139" height="31" bgcolor="#330099" class="textable">First Name:</td> <td>
<input id="fname" name="fname" type="text" size="40" /> </td>
<td width="150" class="textable">Last Name:</td>
<td width="265" class="textable"><table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td ><table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td ><input id="lname" name="lname" type="text" size="40" /></td>
</tr>
</table></td>
</tr>
</table></td>
<td width="32" class="textable"> </td>
</tr>
<tr>
<td height="30" class="textable">Subject:</td> <td>
<span id="spryselect1">
<label>
<select name="sub" id="sub">
<option> Choose a Subject</option>
<option> General Question</option>
<option> MemberShip Area</option>
<option> Others</option>
</select>
</label>
<span class="selectRequiredMsg">Please select a Subject.</span></span>
</td>
<td colspan="3" class="textable"> </td>
</tr>
<tr>
<td height="33" class="textable">Company Name:</td> <td> <input id="cname" name="cname" type="text" size="40" /></td>
<td class="textable">Company Address:</td>
<td class="textable"><table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><input id="cadd" name="cadd" type="text" size="40" onclick="" /></td>
</tr>
</table></td>
<td class="textable"> </td>
</tr>
<tr>
<td height="31" class="textable">Phone Number:</td> <td><input id="phonen" name="phonen" type="text" size="40" /> </td>
<td colspan="3" rowspan="4" class="textable"> </td>
</tr>
<tr>
<td height="31" class="textable">Fax Number:</td><td> <input id="faxn" name="faxn" type="text" size="40" /></td>
</tr>
<tr>
<td height="32" class="textable">Email Address:</td><td><input id="email" name="email" type="text" size="40" /></td>
</tr>
<tr>
<td colspan="2" class="textable"> </td>
</tr>
<tr>
<td valign="top" class="textable">Additional Information:</td>
<td colspan="5" class="textable"><table width="600" border="0" align="left" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2" align="center">
<textarea id="add" name="add" cols="70" rows="10" /></textarea>
</td>
</tr>
<tr>
<td align="center" class="textable">
<input name="Submit" type="submit" value="Submit" onclick="Checking()"/>
</td>
<td align="center" class="textable">
<input type="reset" value="Clear" />
</td>
</tr>
</table></td>
</tr>
<tr>
<td colspan="6" class="textable"> </td>
</tr>
</table></td>
</tr>
</table>
</form>
<script type="text/javascript">
<!--
var spryselect1 = new Spry.Widget.ValidationSelect("spryselect1");
//-->
</script>
</body>
</html>
Try adding an onsubmit to your form tag:
Then remove the onclick event from the submit button.
You need to pass a form object to the Checking function, hence the
this. Also it’s usually better to place the handler in the form tag as it’ll be called when the user submits the form by either clicking the submit button or by pressing enter elsewhere in the form.Edited per webdestroya.