action and onchange problem

berthz · May 30, 2008

I have a webshop I am working on in which I want to include a form in the product_info.php which calculates a certain number depending on the option chosen by the user.

I have included the form in my product_info.php as following:

<?php include 'calculator.php'; ?>

The problem is when someone clicks on one of the options in the calculator.php the action is set to parse the information to calculator.php. However with the parsing of this information the whole page (including product_info.php) is refreshed and the information is not parsed correctly. I want to have this form inside my product_info.php and when submitted it parses the information to the script just below the form instead of refresing the whole page.

I hope it is clear. The calculator.php script is this:

<html>
<body>
<form method="POST" action="<?php echo $_SERVER['PHP_SELF']; ?>">
</p>
<table border="0" cellspacing="1" width="304" id="calculator" height="139">
 <tr>
 <td>
  <label>
<select name="do" id="do" onchange="this.form.submit()">
  <option value="1">14 krt geel goud </option>
  <option value="2">14 krt palladium witgoud</option>
  <option value="3">14 krt nikkel wit goud</option>
  <option value="4">14 krt rose goud </option>
  <option value="5">14 krt rood goud </option>
  <option value="6">18 krt geel goud </option>
  <option value="7">18 krt palladium wit goud</option>
  <option value="8">18 krt nikkel wit goud</option>
  <option value="9">18 krt  rose goud</option>
  <option value="10">18 krt rood goud</option>
  <option value="11">925 zilver </option>
  <option value="12">Platina Cobald</option>
</select>
</label>
</td>
</tr>
<?php
 if(!$_POST['do'])
  {

  }
 else
 {
$do = ($_POST['do']);

$nummer1 = $volume/1000;


if ($do == "1")
{
$nummer2 = 13.8;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '0'</script>";

}

elseif ($do == "2")
{
$nummer2 = 14.4;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '1'</script>";
}

elseif ($do == "3")
{
$nummer2 = 12.8;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '2'</script>";
}

elseif ($do == "4")
{
$nummer2 = 13.3;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '3'</script>";
}

elseif ($do == "5")
{
$nummer2 = 13.1;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '4'</script>";
}

elseif ($do == "6")
{
$nummer2 = 15.6;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '5'</script>";
}

elseif ($do == "7")
{
$nummer2 = 13;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '6'</script>";
}

elseif ($do == "8")
{
$nummer2 = 14.7;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '7'</script>";
}

elseif ($do == "9")
{
$nummer2 = 0;
$result = "onbekend";
echo "<script> keuze = '8'</script>";
}

elseif ($do == "10")
{
$nummer2 = 15.1;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '9'</script>";
}

elseif ($do == "11")
{
$nummer2 = 10.4;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '10'</script>";
}

elseif ($do == "12")
{
$nummer2 = 20.5;
$result = $nummer1 * $nummer2;
echo "<script> keuze = '11'</script>";
}
}
?>

 <tr>
<td width="292" align="center" height="19"><br><b>Soortelijk gewicht in gram: <?php echo($result); ?></b></td>
 </tr>
</table>
<script>
var k = document.getElementsByName("do")[0];
var kk = k.options.selectedIndex=(keuze);
</script>
</form>
</body>
</html>

I hope someone can help me because I have the feeling it shouldnt be too difficult to have this included, its just brainbreaking me after working on this for a while already.

Thanks in advance!

berthz · May 30, 2008

Well I got it working.. Almost.

The problem is that product_info.php is a form. When trying to insert a form within a form you wont be able to submit either form and therefore you will have to insert it either before or after the form, or possibily in a layer, however with different product options different parts of the page are used and with a layer you might be overlapping some of that text on some of the product pages.

What I have now is:

<head>
<script LANGUAGE="JavaScript">
function calculate()
{
document.calcform.total1.value = (document.calcform.quantity1.value) / 1000 * (document.calcform.price1.value)
}
</script>
</head>

<body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0" onload="calculate">

And on the bottom after the </form> tag:

	<center><form name="calcform" action="" method="post">
 <center>
 <input type=hidden name="price1" value="<?php echo $volume; ?>" onChange="calculate()">

 <select name="quantity1" id="quantity1" onclick="return false" onChange="calculate()">
<option value="">----</option>
<option value="13.8">14 krt geel goud</option>
<option value="14.4">14 krt palladium witgoud</option>
<option value="12.8">14 krt nikkel wit goud </option>
<option value="13.3">14 krt rose goud</option>
<option value="13.1">14 krt rood goud</option>
<option value="15.6">18 krt geel goud</option>
<option value="16">18 krt palladium wit goud</option>
<option value="14.7">18 krt nikkel wit goud</option>
<option value="">18 krt  rose goud</option>
<option value="15.1">18 krt rood goud</option>
<option value="10.4">925 zilver</option>
<option value="20.5">Platina Cobald</option>
 </select>
 <input type="text" disabled="disabled" name="total1" size="10">
</center>

<center></form>

The menu now shows on the top of the page, so the next item on my list is to get it down within the page after the drop down features.

action and onchange problem

Recommended Posts

berthz

Link to comment

Share on other sites

berthz

Link to comment

Share on other sites

Archived

Browse

Activity