Printable View
I have a form with multiple text input boxes and a total button plus a submit button on a different form.
The total button adds the numbers that have been entered then the submit button posts the information to another page.
Keeping the two forms, how can I total and send with the submit button?
is there any reason you can't make the total button javascript based and then combine the two forms so there is only one actual submit button? why do they have to be in separate forms?
Due to the layout there are multiple forms some 'post' and some 'get'. I have a menu on the left side of the screen with a number of buttons that do different things and content in the middle.
here are the two forms...
HTML Code:<form name="myform" method="post">
<input name="Cost[0]" type="text" value="" size="5" />
<input name="Cost[1]" type="text" value="" size="5" />
<input name="Cost[2]" type="text" value="" size="5" />
PHP Code:<?php if ($_POST['sum']){
echo "£".array_sum($_REQUEST['Cost']);}
?>
HTML Code:</form>
what do you mean 'total button javascript based' should I ask on the javascript forum?HTML Code:<form method="post" name="myform" target="_blank" onsubmit="return submitmyform(this);">
<input type="hidden" name="Total_Cost" value="<?php $TC= array_sum($_REQUEST['Cost']); echo "$TC"; ?>" />
</form>
well, you can apply an onchange event to your first form's values, and then in that event add the total of the costs array to the "total" element in another form. I made a quick example below, but make sure you read the javascript comments if you're not sure what's going on!
and you can see it working here.PHP Code:<pre><?php
print_r($_POST);
?></pre>
<html>
<head>
<script type="text/javascript">
function totalcosts() {
//total the costs (note, the form is named "totals" and that is why we refer to totals[]
var total = 0, i = 0;
for(i = 0; i < 3; i++){
total += +document.totals['cost[' + i + ']'].value;
}
//update the second form element (note, the form is named "values" and that is why we refer to values['total']
document.values['total'].value = total;
//update the "your total is" text. note that the "<strong>" element has an id of "total_cost," and so this updates the number in that text.
document.getElementById('total_cost').innerHTML = total;
}
</script>
</head>
<body>
<form name="totals" action="javascript_add.php" method="post">
<input type="text" name="cost[0]" onchange="totalcosts()" />
<input type="text" name="cost[1]" onchange="totalcosts()" />
<input type="text" name="cost[2]" onchange="totalcosts()" />
</form>
<hr />
Your total: <strong id="total_cost">0</strong>
<hr />
<form name="values" method="post">
submit these values.
<input type="hidden" name="total" />
<input type="submit" value="submit" />
</form>
</body>
</html>
also, this form has no validation as far as numbers go in the javascript part. if you type in a letter, you'll get unexpected results.
I've tried Implementing the V.Good javascript supplied into my current page, The script isn't working for me - is this because my form is set to GET? If so can It be adapted to suit?
as long as your form is named correctly and has the right hidden <input> name, then submission method shouldn't matter. for example, if your form looked like this:
then the following Javascript line needs to be changed from:Code:<form name="myform" method="get">
<input type="hidden" name="subtotal" />
<input type="submit" value="Submit" />
</form>
document.values['total'].value = total;
to this:
document.myform['subtotal'].value = total;
likewise, the form that has the 3 <input>s used to create the subtotal need to have corresponding form and input names. I've named that form "totals" and the array of <input>s is "cost," so you'd need to change the Javascript to reflect that if you've changed anything.
if you can't get it working, post what you're using and I'll see if I can't figure out what's going on.
HTML Code:<!-- standard html jump menu -->
<script type="text/JavaScript">
<!--
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
//-->
</script>
!standard conect to database & query!PHP Code:// get all values from URL (form set to get)
if(isset($_GET['planttype'])){$planttypeget = $_GET['planttype'];}
if(isset($_GET['plantname'])){$plantnameget = $_GET['plantname'];}
if(isset($_GET['description'])){$plantdescriptionget = $_GET['description'];}
if(isset($_GET['costnumber'])){$costnumber = $_GET['costnumber'];}
if(isset($_GET['planttype'])){$rownumbers = count($_GET['planttype'])+2;}else{$rownumbers = 2;}
I have lots of PHP and would like to implement your awsome code for numbers in the total column (where costnumber[] is) but no matter how I try to change or adapt it, it won't work!?HTML Code:<form method="get">
<table width="100%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td width="75" align="center">Item</td>
<td width="75" align="center">No.</td>
<td align="center">Description</td>
<td width="75" align="center">Total</td>
<td width="75" align="center"></td>
<!--calculating amount of rows to place in -->
</tr><?php $rowcounter=0; while($rownumbers > $rowcounter){if($rowcounter > 0&&$deleterow['X']!=$rowcounter){?>
<tr>
<td align="center"> </td>
<td align="center"><input type="text" name="itemcodes[<?php echo $rowcounter; ?>]" class="boxsquare" value="<?php echo $itemcodes[$rowcounter]; ?>"/></td>
<td><?php $planttype=$_GET['planttype']; if(!$planttype[$rowcounter]){ ?>
<!-- selecting plant type tree/shrub/misc -->
<select name="selectType" class="box" onchange="MM_jumpMenu('parent',this,0)">
<option value="">Type</option>
<?php
while($plant_type = mysql_fetch_array($find_type)){ ?>
<option value="?<?PHP echo $URL_1.$URL_2.$URL_3.$URL_4."&planttype[".$rowcounter."]=".$plant_type['treeShrub']; ?>"><?php echo $plant_type['treeShrub']; ?></option>
<?php $typeno++;} ?>
</select><?php } ?>
<?php $plantname=$_GET['plantname'];if($planttype[$rowcounter]&&!$plantname[$rowcounter]){ ?>
<!-- ########## select plant name apple/pear/turnip ######### -->
<select name="selectPlant" class="box" onchange="MM_jumpMenu('parent',this,0)">
<option value="">Name</option>
<?php
$find_plant = mysql_query("SELECT * FROM $user[WorkS] WHERE treeShrub='$planttype[$rowcounter]' GROUP BY plant ");
while($plant_name = mysql_fetch_array($find_plant)){ ?>
<option value="?<?PHP echo $URL_1.$URL_2.$URL_3.$URL_4."&plantname[".$rowcounter."]=".$plant_name['plant']; ?>"><?php echo $plant_name['plant']; ?></option>
<?php } ?>
</select><?php } $plantdescription=$_GET['description'];if(!$plantdescription[$rowcounter]){echo $plantname[$rowcounter]." - ";} ?>
<?php if($plantname[$rowcounter]&&!$plantdescription[$rowcounter]){ ?>
<!-- ########## select work description plant/remove/reduce ########## -->
<select name="selectDescription" class="box" onchange="MM_jumpMenu('parent',this,0)">
<option value="">Description</option>
<?php
$find_description = mysql_query("SELECT * FROM $user[WorkS] WHERE plant='$plantname[$rowcounter]' GROUP BY type"); // plant description listing
while($plant_description = mysql_fetch_array($find_description)){ ?>
<option value="?<?PHP echo $URL_1.$URL_2.$URL_3.$URL_4."&description[".$rowcounter."]=".$plant_description['type']; ?>"><?php echo $plant_description['type']; ?></option>
<?php } ?>
</select>
<?php } $descriptionmod=$_GET['newdescription']; if($plantdescription[$rowcounter]){?>
<!-- ########## display selection results ########## -->
<textarea name="newdescription[<?php echo $rowcounter; ?>]" cols="60" rows="3" ><?php
if($descriptionmod[$rowcounter]!="") echo "$descriptionmod[$rowcounter]";
else echo "$plantname[$rowcounter] - $plantdescription[$rowcounter]";
?></textarea>
<br/>
<input type="submit" name="adddescription[<?php echo $rowcounter; ?>]" class="boxsmall" value="add description"/>
<input type="submit" name="updatedescription[<?php echo $rowcounter; ?>]" class="boxsmall" value="update description" /><?php } ?>
</td>
<td align="center">
<!-- ########## place a number to calculate total cost ########## -->
<input type="text" name="costnumber[<?php echo $rowcounter; ?>]" class="boxsquare" value="<?php echo $costnumber[$rowcounter]; ?>"/></td>
<td align="center">
<!-- ########## remove a row button ########## -->
<input type="submit" name="itemnumber[<?php echo $rowcounter; ?>]" value="X" class="boxsquare" /></td>
</tr><?php }$rowcounter++;} ?>
<tr>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"><!-- total placed here ?!--></td>
<td align="center"> </td>
</tr>
</table>
<form>
Please help
Thanks
+if you know how I can submit my form when using a jump menu so values entered into the fields total / No. are passed on and recorded!?
first, you need to name your form. name it something simple. in this case, I'll use 'myform.' then, you need to edit the javascript to use this form with your text boxes. then, you need to add an ID attribute to the "totals" area. I thought you said before you wanted to be able to submit this number, but I couldn't find anywhere in this code you posted where you want to do that -- so whatever, I'll skip that part.
new javascript (take note that the for() loop uses $rownumbers to determine how many values to read through, so make sure $rownumbers is defined BEFORE you output this javascript -- oh, and you might need to use $rownumbers+1. try it and find out!):
new form:Code:<script type="text/javascript">
function totalcosts() {
var total = 0, i = 0;
for(i = 0; i < <?php echo $rownumbers; ?>; i++){
total += +document.myform['costnumber[' + i + ']'].value;
}
document.getElementById('total_cost').innerHTML = total;
}
</script>
please excuse my rough putting together of everything. I hope the layout of my "new form" makes sense, I cut out everything I believed to be irrelevant. let me know how it goes.PHP Code:<form name="myform" method="get">
<table>
<!-- bunch of stuff goes here -->
<?php while($something > $somethingelse){ ?>
<!-- .......... -->
<td align="center">
<input type="text" name="costnumber[<?php echo $rowcounter; ?>]" class="boxsquare" value="<?php echo $costnumber[$rowcounter]; ?>"/></td>
<!-- .......... -->
<?php } ?>
<!-- bunch of stuff goes here -->
<tr>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center" id="total_cost">0</td>
<td align="center"> </td>
</tr>
</table>
</form>
thanks kows your the greatest :)