By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
448,548 Members | 1,317 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 448,548 IT Pros & Developers. It's quick & easy.

Form fields added with InnerHTML not posting

P: 2
I have the form below, each field is in a table cell.
When I select cash/check/credit card in the dropdown box payment method, it changes the contents of the next cell to either be a hidden field for cash, a text field for check number, or another dropdown box to select credit card type.
No matter which is selected, the name of the form field is "payinfo"

Unfortunately, when I click submit, every field but payinfo is being sent to my php script.

Expand|Select|Wrap|Line Numbers
  1. <table cellpadding="5" style="border:1px solid black;border-collapse:collapse;"> <form name="form1" id="form1" method="post" autocomplete="off" action=""> <script type="text/javascript">
  2. function settd (paytype) {
  4.     if (paytype == "cash") {
  5.     document.getElementById('payinf').innerHTML = 'Cash<input type="hidden" name="payinfo" value="cash">';
  6.     }
  7.     if (paytype == "check") {
  8.     document.getElementById('payinf').innerHTML = 'Check Number:<input type="text" name="payinfo" size=6>';
  9.     }
  10.     if (paytype == "credit") {
  11.     document.getElementById('payinf').innerHTML = 'Card Type:<select name="payinfo"><option></option><option value="VISA">Visa</option><option value="MC">Master Card</option><option value="AX">American Express</option><option value="DC">Discover</option></select>';
  12.     }
  13. }
  14. </script> <tr><td style="border:1px solid black;">Select Company:</td><td style="border:1px solid black;">Invoice/RA:</td><td style="border:1px solid black;">Payment Method</td><td style="border:1px solid black;">Payment Info</td><td style="border:1px solid black;">Amount</td><td>Notes</td><td></td></tr> <tr><td style="border:1px solid black;"><select name="company"><option></option><option value="c1">company 1</option> <option value="c2">company 2</option> <option value="c3">company 3</option> </select> </td> <td style="border:1px solid black;"><input type="text" size="5" name="invoice"></td> <td style="border:1px solid black;"><select name="method" ONCHANGE="settd(this.options[this.selectedIndex].value);"> <option></option> <option value="cash">Cash</option> <option value="check">Check</option> <option value="credit">Credit Card</option> </select></td> <td style="border:1px solid black;" id="payinf">Select Payment Type</td> <td style="border:1px solid black;"><input type="text" name="amount" size="5" value=""></td> <td style="border:1px solid black;"><input type="text" name="notes" size="10"></td> <td><input type="submit" value="Add Payment"></tr></table><br><br>
Jul 13 '14 #1
Share this Question
Share on Google+
3 Replies

Expert Mod 5K+
P: 8,639
do you have a demo page?

PS. there is no closing form tag.
Jul 14 '14 #2

P: 2
Here is the demo page
When you click the submit button, it goes to a new page that will print the contents of everything sent to it.
Jul 15 '14 #3

Expert Mod 5K+
P: 8,639
there are two main problems to fix:
- <form> is not allowed as child element of <table> (fix: put the table inside the form)
- <script> is not allowed as child element of <table> (fix: put the script block just before the closing body tag)

fixing that should fix your problem.
Jul 16 '14 #4

Post your reply

Sign in to post your reply or Sign up for a free account.