Jump to content

"document.getelementbyid ('total').value = Total;" Not Submitted In Form Post


humanknowledge
 Share

Recommended Posts

Hi w3 schools, I have an issue with a javascript code that I wrote. This script is a simply for calculating the summation of 2 text input boxes and printing it in another text input box within the form. The entire form is then sent using Form postThe total is written back to the form's total text input box using the code below: document.getElementById ('total').value = totalThis code works perfectly for displaying the values on screen. However, when I send the form (PHP Post), the " total " field is empty. I have searched all over for possible solutions. But no solution yet. Does anybody have any idea. PS: Things I have tried: 1. document.getElementById ('total').INNERHTML = total This does not even work on screen and total field is not updated on screen. Needless to say, the PHP Post variable was also empty.

Link to comment
Share on other sites

would help if you supplied source code, but heres an simple example to go byhtml/xhtml page

<!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=iso-8859-1" /><title>Untitled Document</title><script type="text/JavaScript">function runthis(){var x =document.getElementById("calcvalue1").value;var y =document.getElementById("calcvalue2").value;var total= (parseInt(x)+parseInt(y));//alert(total)document.getElementById("calctotalvalue").value=total;}</script></head><body><form action="posttohere.php" method="post"><input id="calcvalue1" name="calcvalue1" type="text" value="0" onchange="runthis()" /><br /><input id="calcvalue2" name="calcvalue2" type="text" value="0" onchange="runthis()"  /><br /><input id="calctotalvalue" name="calctotalvalue" type="text" value="0" readonly="readonly" /><input name="submitthis" type="submit" value="Submit to php page" /></form></body></html>

posttohere.php

  <!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=iso-8859-1" /><title>Untitled Document</title><?php$calcvalue1=$_REQUEST['calcvalue1'];$calcvalue2=$_REQUEST['calcvalue2'];$calctotalvalue=$_REQUEST['calctotalvalue'];?></head><body><?phpecho "value one: ".$calcvalue1."<br />";echo "value two: ".$calcvalue2."<br />";echo "equals:     ".$calctotalvalue;?></body></html>    

Edited by dsonesuk
Link to comment
Share on other sites

I found the issue.The problem was not from my javascript afterall. The problem was that I had set "disabled" attribute for the form elements being calculated. Apparently I should have used the readonly attribute. http://www.htmlcodetutorial.com/forms/_INPUT_DISABLED.htmlthis says:DISABLED does the same thing but takes it further: the user cannot use the field in any way, not to highlight the text for copying, not to select the checkbox, not to submit the form. In fact, a disabled field is not even sent if the form is submitted.Thanks for your help.@donsenuk ... you code above pointed me in the right direction .

Edited by humanknowledge
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...