problem with button/submit input type

920506 · Jun 29, 2004

Hi,
I have a javascript that dynamically display premium for different ageband based on what the deductible for the insurance, but whenever I click the GetRate button,
the message "Object doesn't support this method" always popup. It is complaining about start() function called. But if I use refresh buttton. it's OK. Can anybody help?
The code is as follow:
--------
<html>
<head>
<title>Sample code - Traversing an HTML Table with JavaScript and DOM Interfaces</title>

<script language="JavaScript">

function start() {
var Deduct250=new Array("$40", "$50", "$60", "$80", "$100", "$120");
var Deduct500=new Array("$70", "$93", "$126", "$175", "$292", "$324");
var Deduct1000=new Array("$60", "$70", "$90", "$100", "$130", "$150");
var Deduct1500=new Array("$80", "90", "100", "150", "200", "250");
var AgeBand=new Array("<30", "30-39", "40-49", "50-59", "60-64", "65-69");
var output="<h4>Rate Table</h4>";
output +="<table border='2' cellspacing='3' cellpadding='1' ><tr><th>Age</th><th>$Premium/M</th></tr>";
for (i=0; i<6; i++) {

var v=document.SendMe.DropIt[document.SendMe.DropIt.selectedIndex].value;
var a=document.SendMe.Age[document.SendMe.Age.selectedIndex].value;

var ratearr=new Array(6)
switch (v) {
case "250": ratearr=Deduct250; break;
case "500": ratearr=Deduct500; break;
case "1000": ratearr=Deduct1000; break;
case "1500": ratearr=Deduct1500; break;
default: ;
}
//if (v==250) output+="<tr><td>";
output+="<tr><td>";
var j=0;
while ( j<6) {
if (AgeBand[j]== a) break;
j++;
}

output +=AgeBand[j] + "</td><td>"
i=j;
output += ratearr + "</td></tr>";
break;
// if (v==1000)output+="<tr><td>" + AgeBand + "</td><td>" + Deduct1000 + "</td></tr>";
// if (v==1500)output+="<tr><td>" + AgeBand + "</td><td>" + Deduct1500 + "</td></tr>";
}
output+="</table>";
document.getElementById("myTable").innerHTML=output;
}
</script>

</head>
<body onload="start()">

<p>A drop down Deductible Menu</p>
<form method="POST" name="SendMe" >
<p>Deductible<select name="DropIt" size="1" >
<option value="250" selected> $250 </option>
<option value="500"> $500 </option>
<option value="1000" > $1000</option>
<option value="1500"> $1500 </option>
</select> </p>
<p>Age<select name="Age" size="1" >
<option value="<30"> <30 </option>
<option value="30-39" selected>30-39</option>
<option value="40-49"> 40-49 </option>
<option value="50-59"> 50-59 </option>
<option value="60-64"> 60-64 </option>
<option value="65-69"> 65-69 </option>
<option value="70-79*"> 70-79* </option>
<option value="80**+"> 80**+ </option>
</select> </p>
<p>Destination<select name="Destination" size="1" >
<option value="Inbound">Inbound </option>
<option value="Outbound" selected> Outbound</option>
</select> </p>
<p><input type="submit" name="submit" value="GetRate" onClick="start()"></p>

<p><div id="Coverage"></div></p>
<script language="JavaScript">
function updatelink() {
var v=document.SendMe.DropIt.value;
if (v==1000) { output1="<a href='
http://www.travelinsure.com'>";
output1 +="Coverage";
output1 +="</a>"
document.getElementById("Coverage").innerHTML=output1;
document.getElementById("Coverage").href="
http://www.yahoo.com";
}
if (v==250) { output1="<a href='
http://www.google.com'>";
output1 +="Coverage";
output1 +="</a>"
document.getElementById("Coverage").innerHTML=output1;
document.getElementById("Coverage").href="
http://www.google.com";
}
}
</script>
<p>
<div id="myTable"></div>
</p>

<p><select name="State" size="1" >
<option value="CA">California</option>
<option value="NE" selected>Nebraska</option>
<option value="WA">Washington </option>
<option value="MO">Missouri </option>
</select> </p>
</form>
</body>
</html>

WartookMan · Jun 29, 2004

You are trying to submit, but call a function at the same time. You would need to trap the "onsubmit" event of the form, to update the values.

That is, use:

Code:

<form method="POST" name="SendMe" onsubmit="start(); return false">

and change your SUBMIT statement to:

Code:

<input type="submit" name="submit" value="GetRate">

Alternatively, you could change the SUBMIT button into an HTML4 BUTTON element...

Try changing the following:
FROM:

Code:

<input type="submit" name="submit" value="GetRate" onClick="start()">

TO:

Code:

<button name="submitbtn" onclick="start()">GetRate</button>

Hope this helps.

Pete.

Web Developer & Aptrix / IBM Lotus Workplace Web Content Management (LWWCM) Specialist
w:

http://www.lwwcm.com/

e: Pete.Raleigh(at)lclimited.co.uk

920506 · Jun 29, 2004

Thanks,Pete, that really helps and save me a lot of time.
this discussion board do have a lot of people like you, quick and to the point.
thanks
Betty

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

problem with button/submit input type

920506

Programmer

WartookMan

Technical User

920506

Programmer

Similar threads

Part and Inventory Search

Sponsor