Dynamically created fields not being sent with Submit

Question

ktyler 0 Newbie Poster

14 Years Ago

I have the following code (at the end) that will create a new distribution row dynamically.

Everything looks good on the page and here is the innerHTML for the new row:

<TD style="WIDTH: 10px">&nbsp;</TD>
<TD colSpan=4>Distribution to: <INPUT name=newdistacct>  <INPUT name=newdistshare>  <INPUT type=checkbox Name="newdistdefault"></TD>
<TD>* New</TD>
<TD><INPUT style="TEXT-ALIGN: right" Name="newdistamt"><INPUT id=removedist value="Remove Distribution" type=button></TD>

When the form is submitted, it is recognizing the newdistacct and newdistshare fields. However, the newdistdefault and the newdistamt fields aren't being passed to the POST.
Anyone see anything that could be causing this.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>EFT</title>
</head>
<body>
<form id='eftform' method=post action='symitar://HTMLView~Action=Post'>
<table style='width: 100%'>
<tr style='background-color: #DDDDEE'>
<td><h2 style='color: #3333CC'>EFT</h2></td>
</tr>
</table>

<table style='width: 100%'>  
<tr>
<td style='width: 15%;white-space: nowrap'>Account:</td>
<td style='width: 25%;white-space: nowrap'><b>3080163525</b></td>
<td style='width: 15%;white-space: nowrap'>Member Name:</td>
<td style='white-space: nowrap'><b>JANE DOE</b></td>
</tr>
<tr><td colspan=4><hr style='size=1;color:#AAAABB'></td></tr>
</table>

<table id='eftdetail' border=1 style='width:100%;'>
<tr><td colspan=5 style='width:50%;'>&nbsp;</td>
<td style='width:10%;'>Stop</td>
<td>New Amount/Information</td>
</tr>
<tr>
<td colspan=3 style='width:30%;'>Payroll Group 999999 to S 99</td>
<td style='width:15%;text-align:right;'>$  465.00</td>
<td style='width:5%;'>&nbsp;</td>
<td><input type=checkbox id='allstop' name='allstop' onclick='updateStopAll(this.form)'></td>
<td><input name='totalamt' style='text-align: right' onchange='FixField(this)'> 
<input type=hidden name='totalamthidden' value=' 465.00'></td>
</tr>
<tr>
<td colspan=2 style='width:20;'>&nbsp;</td>
<td>Agency (Cabinet/Department): </td>
<td style='text-align: right'>
&nbsp;
</td>
<td colspan=2>&nbsp;</td>
<td><input name='agency'></td>
</tr>
<tr>
<td colspan=2>&nbsp;</td>
<td>Effective Date: </td>
<td style='text-align: right'>--/--/--</td>
<td colspan=2>&nbsp;</td>
<td><input name='effective'></td>
</tr>
<tr>
<td colspan=2>&nbsp;</td>
<td>Expiration Date: </td>
<td style='text-align: right'>--/--/--</td>
<td colspan=3>&nbsp;</td>
</tr>
<tr>
<td colspan=2>&nbsp;</td>
<td>Frequency: </td>
<td style='text-align:right;'>Semimonthly</td>
<td colspan=2>&nbsp;</td>
<td><select name='frequency'>
<option value='Please choose'>Please Choose</Option>
<option value='Semimonthly'>Semimonthly</Option>
<option value='Monthly/15th'>Monthly/15th</Option>
<option value='Monthly/30th'>Monthly/30th</Option>
</select>
</td>
</tr>
<tr>
<td colspan=2>&nbsp;</td>
<td>Last Transaction Amount: </td>
<td style='text-align: right'>$  465.00</td>
<td colspan=3>&nbsp;</td>
</tr>
<tr>
<td colspan=2>&nbsp;</td>
<td>Last Transaction Date: </td>
<td style='text-align: right'>07/30/10</td>
<td colspan=3>&nbsp;</td>
</tr>
<tr>
<td style='width:10;'>&nbsp;</td>
<td colspan=2>Distribution to 3080163525 L 01:  </td>
<td style='text-align:right;'>$   76.00
</td>
<td>&nbsp;
  P
</td>
<td><input type=checkbox id='stop00' name='stop' onclick='updateStop(this)'></td>
<td><input id='newamt00' name='newamt' style='text-align: right' onchange='FixField(this)'>
<input type=hidden id='newamthidden00' name='newamthidden' value='  76.00'></td>
</tr>
<tr>
<td style='width:10;'>&nbsp;</td>
<td colspan=2>Distribution to 3080163525 L 43:  </td>
<td style='text-align:right;'>$   30.00
</td>
<td>&nbsp;
  P
</td>
<td><input type=checkbox id='stop01' name='stop' onclick='updateStop(this)'></td>
<td><input id='newamt01' name='newamt' style='text-align: right' onchange='FixField(this)'>
<input type=hidden id='newamthidden01' name='newamthidden' value='  30.00'></td>
</tr>
<tr>
<td>&nbsp;</td>
<td colspan=2 style='font-style:italic;'>Total of Distributions:</td>
<td style='font-style:italic;text-align:right;'>$  106.00</td>
<td colspan=2>&nbsp;</td>
<td><input name='disttotal' style='text-align: right' disabled></td>
</tr>
<tr>
<td>&nbsp;</td>
<td colspan=2 style='font-style:italic;'>EFT Leftover for Deposit to Share:</td>
<td style='font-style:italic;text-align:right;'> $  359.00</td>
<td colspan=2>&nbsp;</td>
<td><input name='difference' style='text-align: right' disabled></td>
</tr>
  <tr><td colspan=7>&nbsp;</td></tr>
  <tr>
  <td>&nbsp;</td>
  <td colspan=3><input type='SUBMIT' value='Submit' id='submitbutton'></td>
  <td><input type='button' value='Add New Distribution' id='anotherdistribution' onclick='addDistritionToTable();'>
     &nbsp;&nbsp;</td>
  </tr>
</table>
</form>
<script type='text/javascript'>
function updateStopAll(formObj) {
  var dist_total = 0;
  var fieldid = '';
  if (formObj.allstop.checked) {
   document.getElementById('totalamt').value = round_decimals(0,2);
    for (var i=0; i<formObj.elements.length; ++i) {
     if (formObj.elements[i].name=='stop') {
      form_field = formObj.elements[i];
      form_field.checked = true;
      fieldid = form_field.id;
      fieldid = fieldid.replace('stop','newamt');
     }
     if (formObj.elements[i].id==fieldid && fieldid!='' ) {
      formObj.elements[i].value = round_decimals(0,2);
      fieldid = ''
     }
    }
  } else {
   document.getElementById('totalamt').value = document.getElementById('totalamthidden').value;
    for (var i=0; i<formObj.elements.length; ++i) {
     if (formObj.elements[i].name=='stop') {
      form_field = formObj.elements[i];
      form_field.checked = false;
      fieldid = form_field.id;
      fieldid = fieldid.replace('stop','newamt');
     }
     if (formObj.elements[i].id==fieldid && fieldid!='' ) {
      hidden_field = document.getElementById(fieldid.replace('newamt','newamthidden'));
      formObj.elements[i].value = hidden_field.value;
      fieldid = ''
     }
    }
  }
  setTotals();
}
  function round_decimals(original_number, decimals) {
    if (isNaN(original_number)) { 
      original_number = original_number.replace(',','')
    }
    var result1 = original_number * Math.pow(10,decimals)
    var result2 = Math.round(result1)
    var result3 = result2 / Math.pow(10,decimals)
    return pad_with_zeros(result3,decimals)
  }
  function pad_with_zeros(rounded_value,decimal_places) {
    var value_string = rounded_value.toString();
    var decimal_location = value_string.indexOf(".")
    if (decimal_location == -1) {
      decimal_part_length = 0
      value_string += decimal_places > 0 ? "." : ""
    } else {
      decimal_part_length = value_string.length - decimal_location - 1
    }
    var pad_total = decimal_places - decimal_part_length
    if (pad_total>0) {
      for (var counter=1; counter<=pad_total; counter++)
        value_string += "0"
    }
    return value_string
  }
  function updateStop(obj) {
    var fieldid = obj.id;
    var myform = obj.form;
    var newamtfield = document.getElementById(obj.id.replace('stop','newamt'));  
    if (obj.checked) {
      newamtfield.value = round_decimals(0,2);
    } else {
      var hiddenfield = document.getElementById(obj.id.replace('stop','newamthidden'));
      newamtfield.value = hiddenfield.value;
    }
    setTotals();
  }
function setTotals() {
  var total = 0;
  var distsum = 0;
  var leftover = 0;
  
  totalfield = document.getElementById('totalamt');
  distributions = document.getElementsByName('newamt');
  newdistributions = document.getElementsByName('newdistamt');
  disttotal = document.getElementById('disttotal');
  difference = document.getElementById('difference');
  
  if (totalfield.value=='') {
    totalfield.value = document.getElementById('totalamthidden').value;
  }
  if (!isNaN(parseFloat(totalfield.value,10))) {
    total += parseFloat(totalfield.value,10);
  }
  for (var i=0; i<distributions.length; ++i) {
    if (distributions[i].value=='') {
      distributions[i].value = document.getElementById(distributions[i].id.replace('newamt','newamthidden')).value;
    }
    if (!isNaN(parseFloat(distributions[i].value))) {
      distsum += parseFloat(distributions[i].value)
    }
  }
  var tbl = document.getElementById('eftdetail');  
  for (var i=0; i<tbl.rows.length; ++i) {
    if (tbl.rows[i].cells.length>2) {
      if (tbl.rows[i].cells[2].innerHTML == '* New') {
        distsum += parseFloat(tbl.rows[i].cells[3].childNodes[0].value)
      }
     }
  }
  leftover = total - distsum;
  totalfield.value = total.toFixed(2);
  disttotal.value = round_decimals(distsum,2);
  difference.value = round_decimals(leftover,2);
  }
  function FixField(obj) {
    obj.value = round_decimals(obj.value,2);
    setTotals();
  }
  function addDistritionToTable() {
    var tbl = document.getElementById('eftdetail');
    var lastRow = tbl.rows.length;
    var rowloc = lastRow-4;
    var row = tbl.insertRow(rowloc);
    
    var cell = row.insertCell(0);
    cell.innerHTML = '&nbsp;'    
    cell.style.width = '10'
    
    var cell = row.insertCell(1);
    cell.innerHTML = '&nbsp;'    
    cell.colSpan = 4
    cell.innerHTML = 'Distribution to: '
    var e1 = document.createElement('input');
    e1.Name = 'newdistacct';
    cell.appendChild(e1);
    cell.innerHTML = cell.innerHTML + '   '
    e1 = document.createElement('input');
    e1.Name = 'newdistshare';
    cell.appendChild(e1);
    cell.innerHTML = cell.innerHTML + '   '
    var chk1 = document.createElement('input');
    chk1.setAttribute('Name', 'newdistdefault');
    chk1.setAttribute('type', 'checkbox');
    cell.appendChild(chk1);
    
    var cell = row.insertCell(2);
    cell.innerHTML = '* New'    
    
    var cell = row.insertCell(3);
    e1 = document.createElement('input');
    e1.Name = 'newdistamt';
    e1.style.textAlign = 'right';
    e1.onchange = function () {FixField(this)};
    cell.appendChild(e1);
    
    var e1 = document.createElement('input');
    e1.type = 'button';
    e1.id = 'removedist';
    e1.value = 'Remove Distribution';
    e1.onclick = function () {deleteRow(this)};    
    cell.appendChild(e1);
    alert(row.innerHTML);
  }
  function deleteRow(obj) {
    var delRow = obj.parentNode.parentNode;
    var tbl = delRow.parentNode.parentNode;
    var rIndex = delRow.sectionRowIndex;
    var rowArray = new Array(delRow);
    deleteRows(rowArray);
  }
function deleteRows(rowObjArray) {
  for (var i=0; i<rowObjArray.length; i++) {
    var rIndex = rowObjArray[i].sectionRowIndex;
    rowObjArray[i].parentNode.deleteRow(rIndex);
  }
}
</script>
</body>
</html>

javascript

2 Contributors
1 Reply
129 Views
6 Hours Discussion Span
Latest Post 14 Years Ago Latest Post by Taywin

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Taywin 312 Posting Virtuoso · Answer 1 · 2010-09-28T02:28:20+00:00

<INPUT name=newdistshare>  <INPUT type=checkbox Name="newdistdefault">

Not sure but your attribute 'Name' should be 'name'. That's the only thing I am seeing from a quick look here...