Submitting Dynamic Form Data Problem

**Jt3689** · 12-10-2012 09:03 PM

Im trying to simply email the form data to an email address but I'm not sure why its not complete the task. I have 2 functions that are supposed to obtain the data thats put into the form. Any suggestions?

Code:

<html>
<head>
<script type="text/javascript">

</script>
<script language="JavaScript">

function addRow(tableID){
    var table = document.getElementById(tableID);
    
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    
    var cell1 = row.insertCell(0);
    var element1 = document.createElement("input");
    element1.type = "text";
    element1.name = "empNo";
    cell1.appendChild(element1);
    
    var cell2 = row.insertCell(1);
    var element2 = document.createElement("input");
    element2.type = "text";
    cell2.appendChild(element2);
    
    var cell3 = row.insertCell(2);
    var element3 = document.createElement("textarea");
    element3.setAttribute("name","mytextarea");
    element3.setAttribute("cols","10");
    element3.setAttribute("rows","1");
    cell3.appendChild(element3);
}
function deleteRow(tableID) {

    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    if(rowCount > 1) {
    table.deleteRow(rowCount - 1);
}


}
</script>
<script language="JavaScript">

function addRow4(tableID){
    var table = document.getElementById(tableID);
    
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    
    var celld = row.insertCell(0);
    var elementd = document.createElement("input");
    elementd.type = "text";
    elementd.name = "empNo";
    celld.appendChild(elementd);
    
    var celle = row.insertCell(1);
    var elemente = document.createElement("input");
    elemente.type = "text";
    celle.appendChild(elemente);
    
    var cellf = row.insertCell(2);
    var elementf = document.createElement("textarea");
    elementf.setAttribute("name","mytextarea");
    elementf.setAttribute("cols","10");
    elementf.setAttribute("rows","1");
    cellf.appendChild(elementf);
}
function deleteRow(tableID) {

    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    if(rowCount > 1) {
    table.deleteRow(rowCount - 1);
}

}
</script>
<script language="JavaScript">
<!--



function addRow4(tableID){
    var table = document.getElementById(tableID);
    
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    
    var celld = row.insertCell(0);
    var elementd = document.createElement("input");
    elementd.type = "text";
    elementd.name = "empNo";
    celld.appendChild(elementd);
    
    var celle = row.insertCell(1);
    var elemente = document.createElement("input");
    elemente.type = "text";
    celle.appendChild(elemente);
    
    var cellf = row.insertCell(2);
    var elementf = document.createElement("textarea");
    elementf.setAttribute("name","mytextarea");
    elementf.setAttribute("cols","10");
    elementf.setAttribute("rows","1");
    cellf.appendChild(elementf);
}
function deleteRow(tableID) {

    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    if(rowCount > 1) {
    table.deleteRow(rowCount - 1);
}

}

function MM_popupMsg(msg) { //v1.0
  alert(msg);
}
//-->
</script>
<script>
<!--
function getRowsData(sheet, range, columnHeadersRowIndex) {
  var headersIndex = columnHeadersRowIndex || range ? range.getRowIndex() - 1 : 1;
  var dataRange = range ||
    sheet.getRange(headersIndex + 1, 1, sheet.getMaxRows() - headersIndex, sheet.getMaxColumns());
  var numColumns = dataRange.getLastColumn() - dataRange.getColumn() + 1;
  var headersRange = sheet.getRange(headersIndex, dataRange.getColumn(), 1, numColumns);
  var headers = headersRange.getValues()[0];
  return getObjects(dataRange.getValues(), normalizeHeaders(headers));
}

function getObjects(data, keys) {
  var objects = [];
  for (var i = 0; i < data.length; ++i) {
    var object = {};
    var hasData = false;
    for (var j = 0; j < data[i].length; ++j) {
      var cellData = data[i][j];
      if (isCellEmpty(cellData)) {
        continue;
      }
      object[keys[j]] = cellData;
      hasData = true;
    }
    if (hasData) {
      objects.push(object);
    }
  }
  return objects;
console.log 
}

function MM_callJS(jsStr) { //v2.0
  return eval(jsStr)
}
//-->
</script>
</head><h3>Athletic-Profile</h3>

<ul id="countrytabs" class="shadetabs">
  <li><a href="#" rel="country1" class="selected">Tab 1</a></li>
  <li><a href="#" rel="country2">Tab 2</a></li>
  <li><a href="#" rel="country3">Tab 3</a></li>
  <li><a href="#" rel="country4">Tab 5</a></li>
  <li><a href="#" rel="country5">Tab 6</a></li>
  <li><a href="#" rel="country6">Tab 7</a></li>
</ul>

<div style="border:1px solid gray; width:450px; margin-bottom: 1em; padding: 10px">

  <div id="country1" class="tabcontent"> 
    <form name="form1" method="post" action="">
      <input name="button" type="button" onClick="addRow('datatable')"value="Add New Set">
      <table id="datatable" cellspacing="0" border="1" bgcolor="#738711">
        <tbody>
          <tr> 
            <td><input name="text" type="text" ></td>
            <td><input name="text" type="text"></td>
            <td><textarea name="textarea" cols="10" rows="1"></textarea></td>
            <td><a href="javascript:void(0);" onClick="deleteRow('datatable')" >Remove</a></td>
          </tr>
        </tbody>
      </table>
    </form>
    
  </div>
  <div id="country2" class="tabcontent">
<form name="f1" id="f1">
      <input name="button2" type="button" onClick="addRow2('datatable2')"value="Add New Set">
      <table id="datatable2" cellspacing="0" border="1" bgcolor="#738711">
        <tbody>
          <tr> 
            <td width="144"><input name="text2" type="text" ></td>
            <td width="144"><input name="text2" type="text"></td>
            <td width="95"><textarea name="textarea2" cols="10" rows="1"></textarea></td>
            <td width="50"><a href="javascript:void(0);" onClick="deleteRow('datatable')" >Remove</a></td>
          </tr>
        </tbody>
      </table>
    </form>

  </div>
  <div id="country3" class="tabcontent">
    <form name="f1" id="f1">
      <input name="button3" type="button" onClick="addRow('datatable3')"value="Add New Set">
      <table id="datatable3" cellspacing="0" border="1" bgcolor="#738711">
        <tbody>
          <tr> 
            <td><input name="text3" type="text" ></td>
            <td><input name="text3" type="text"></td>
            <td><textarea name="textarea3" cols="10" rows="1"></textarea></td>
            <td><a href="javascript:void(0);" onClick="deleteRow('datatable3')" >Remove</a></td>
          </tr>
        </tbody>
      </table>
    </form>
    
  </div>
  <div id="country4" class="tabcontent">
    <form name="f1" id="f1">
      <input name="button4" type="button" onClick="addRow('datatable4')"value="Add New Set">
      <table id="datatable4" cellspacing="0" border="1" bgcolor="#738711">
        <tbody>
          <tr> 
            <td><input name="text4" type="text" ></td>
            <td><input name="text4" type="text"></td>
            <td><textarea name="textarea4" cols="10" rows="1"></textarea></td>
            <td><a href="javascript:void(0);" onClick="deleteRow('datatable4')" >Remove</a></td>
          </tr>
        </tbody>
      </table>
    </form>
    
  </div>
  <div id="country5" class="tabcontent">
    <form name="f1" id="f1">
      <input name="button5" type="button" onClick="addRow('datatable5')"value="Add New Set">
      <table id="datatable5" cellspacing="0" border="1" bgcolor="#738711">
        <tbody>
          <tr> 
            <td><input name="text5" type="text" ></td>
            <td><input name="text5" type="text"></td>
            <td><textarea name="textarea5" cols="10" rows="1"></textarea></td>
            <td><a href="javascript:void(0);" onClick="deleteRow('datatable5')" >Remove</a></td>
          </tr>
        </tbody>
      </table>
    </form>
    
  </div>
  <div id="country6" class="tabcontent">
<form name="f1" id="f1">
      <input name="button6" type="button" onClick="addRow('datatable6')"value="Add New Set">
      <table width="100" border="1" cellspacing="0" bgcolor="#738711" id="datatable6">
        <tbody>
          <tr> 
            <td width="144"><input name="text6" type="text" ></td>
            <td width="144"><input name="text6" type="text"></td>
            <td width="95"><textarea name="textarea6" cols="10" rows="1"></textarea></td>
            <td width="50"><a href="javascript:void(0);" onClick="deleteRow('datatable6')" >Remove</a></td>
          </tr>
        </tbody>
      </table>
    </form>
    <p><br />
    </p>
    </div>



</div>

<script type="text/javascript">



</script>

  <input name="Submit" type="submit" onClick="MM_popupMsg('Almost There!!!');MM_callJS('getRowsData');MM_callJS('getObjects')" value="Submit" action="mailto:jordan.c.toler@gmail.com">
</form>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

<hr />

<hr />

</script>

Thread: Submitting Dynamic Form Data Problem

Thread Tools

Display

Submitting Dynamic Form Data Problem

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions