i tried to submit my form with that java script. But it didn't work as it should be,it doesn't get the value from the script. it's only work for the alert coding in my html body, but it didn't read the function check(), is my form have some problem?
<form name="myForm" method="post" onsubmit="return check()">
<table width="100%">
<tr>
<div id="space">
YOUR DETAILS
</div><!-- space -->
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>First Name</td>
<td width="720">
<input type="text" name="fname">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Last Name</td>
<td width="720">
<input type="text" name="lname">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Email</td>
<td width="720">
<input type="email" name="email">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Telephone</td>
<td width="720">
<input type="tel" name="telephone">
</td>
</tr>
<tr>
<td width="186">Fax</td>
<td width="720">
<input type="tel" name="fax">
</td>
</tr>
<tr>
<td width="186">Company</td>
<td width="720">
<input type="text" name="company">
</td>
</tr>
<tr>
<td width="186">Company ID</td>
<td width="720">
<input type="text" name="cid">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Address 1</td>
<td width="720">
<input type="text" name="add1">
</td>
</tr>
<tr>
<td width="186">Address 2</td>
<td width="720">
<input type="text" name="add2">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>City</td>
<td width="720">
<input type="text" name="city" >
</td>
</tr>
<tr>
<td width="186">Poscode</td>
<td width="720">
<input type="text" name="poscode" >
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Country</td>
<td width="720">
<select name="country">
<option value="malaysia">Malaysia</option>
<option value="australia">Australia</option>
<option value="japan">Japan</option>
<option value="newzealand">New Zealand</option>
</select>
</td>
</tr>
</table>
<br><br>
<input type="button" onclick="check()" name="submit" value="Submit" class="sbutton" />
<button name="subcancel" class="sbutton" value="Cancel" >CANCEL</button>
</form>
This is my javascript function
function check(){
alert('hi');
var isi1=document.forms["myForm"]["fname"].value;
var isi2=document.forms["myForm"]["lname"].value;
var isi3=document.forms["myForm"]["email"].value;
var isi4=document.forms["myForm"]["tel"].value;
var isi5=document.forms["myForm"]["add1"].value;
var isi6=document.forms["myForm"]["city"].value;
var isi7=document.forms["myForm"]["country"].value;
if (isi1 == "") {
alert("Please complete all your detail with '*' symbol!");
return false;
}
else if(isi2 ==""){
alert("Please complete your detail!");
return false;
}
else if(isi3 ==""){
alert("Please complete your detail!");
return false;
}
else if(isi4 ==""){
alert("Please complete your detail!");
return false;
}
else if(isi5 ==""){
alert("Please complete your detail!");
return false;
}
else if(isi6 ==""){
alert("Please complete your detail!");
return false;
}
else{
alert("Hi "+isi1+" "+isi2+"!! You are succesfully registered to our bookstore!!");
return true;
}
}
Check the working code below:
function check() {
alert('hi');
var isi1 = document.forms["myForm"]["fname"].value;
var isi2 = document.forms["myForm"]["lname"].value;
var isi3 = document.forms["myForm"]["email"].value;
var isi4 = document.forms["myForm"]["telephone"].value;
var isi5 = document.forms["myForm"]["add1"].value;
var isi6 = document.forms["myForm"]["city"].value;
var isi7 = document.forms["myForm"]["country"].value;
if (isi1 == "") {
alert("Please complete all your detail with '*' symbol!");
return false;
}
else if (isi2 == "") {
alert("Please complete your detail!");
return false;
}
else if (isi3 == "") {
alert("Please complete your detail!");
return false;
}
else if (isi4 == "") {
alert("Please complete your detail!");
return false;
}
else if (isi5 == "") {
alert("Please complete your detail!");
return false;
}
else if (isi6 == "") {
alert("Please complete your detail!");
return false;
}
else {
alert("Hi " + isi1 + " " + isi2 + "!! You are succesfully registered to our bookstore!!");
return true;
}
}<form name="myForm" method="post" onsubmit="return check()">
<table width="100%">
<tr>
<div id="space">
YOUR DETAILS
</div><!-- space -->
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>First Name</td>
<td width="720">
<input type="text" name="fname">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Last Name</td>
<td width="720">
<input type="text" name="lname">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Email</td>
<td width="720">
<input type="email" name="email">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Telephone</td>
<td width="720">
<input type="tel" name="telephone">
</td>
</tr>
<tr>
<td width="186">Fax</td>
<td width="720">
<input type="tel" name="fax">
</td>
</tr>
<tr>
<td width="186">Company</td>
<td width="720">
<input type="text" name="company">
</td>
</tr>
<tr>
<td width="186">Company ID</td>
<td width="720">
<input type="text" name="cid">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Address 1</td>
<td width="720">
<input type="text" name="add1">
</td>
</tr>
<tr>
<td width="186">Address 2</td>
<td width="720">
<input type="text" name="add2">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>City</td>
<td width="720">
<input type="text" name="city">
</td>
</tr>
<tr>
<td width="186">Poscode</td>
<td width="720">
<input type="text" name="poscode">
</td>
</tr>
<tr>
<td width="186"><span style="color:red;">*</span>Country</td>
<td width="720">
<select name="country">
<option value="malaysia">Malaysia</option>
<option value="australia">Australia</option>
<option value="japan">Japan</option>
<option value="newzealand">New Zealand</option>
</select>
</td>
</tr>
</table>
<br><br>
<input type="button" onclick="check()" name="submit" value="Submit" class="sbutton" />
<button name="subcancel" class="sbutton" value="Cancel">CANCEL</button>
</form>