2013-05-30 145 views
0

我在我的javascript代碼中選擇了幾個選擇器。其中之一是用於產生另一種選擇觸發:動態HTML選擇器/選項不以表格形式發送

<form id="reportform" name="reportform" action=""> 
    <table cellpadding="3" cellspacing="16"> 
     <thead> 
      <th class="report" colspan="2">Select Scope</th> 
      <th class="report" colspan="2">Select Date</th> 
      <th class="report" colspan="2">Options</th> 
     </thead> 
     <tbody> 
      <tr> 
      ... 
       <td> 
        Period 
       </td> 
       <td> 
        <select id="period" name="period"> 
         <option selected="selected" value="0">- Select -</option> 
         <option value="1">Day</option> 
         <option value="2">Month</option> 
         <option value="3">Year</option> 
        </select> 
       </td> 
       ... 
      </tr> 
       ... 
      <tr> 
       <td></td> 
       <td></td> 
       <td id="date-label2"></td> 
       <td id="date2"></td> 
       <td></td> 
       <td></td> 
      </tr> 
      <tr> 
       <td></td> 
       <td></td> 
       <td></td> 
       <td></td> 
       <td></td> 
       <td align="right"> 
        <input id="go" class="go" type="submit" value="Report"> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
</form> 

當在期間選擇選項之一被選擇時所執行的一個函數:這裏使用

$('#period').change(function() { 
    switch($('#period').find(":selected").text()){ 
     case 'Day': 
      clearDates(); 

      var label = document.getElementById("date-label"); 
      var txt = document.createTextNode("day"); 
      label.appendChild(txt); 

      var day = document.getElementById("date"); 
      var input = document.createElement("input"); 
      input.className = "day-report"; 
      day.appendChild(input); 
      break; 
     case 'Month': 
      ... 
     case 'Year': 
      ... 
    } 
}); 

功能:

function clearDates(){ 
    var date = document.getElementById("date-label"); 
    while (date.hasChildNodes()) { 
     date.removeChild(date.lastChild); 
    } 
    date = document.getElementById("date"); 
    while (date.hasChildNodes()) { 
     date.removeChild(date.lastChild); 
    } 
    date = document.getElementById("date-label2"); 
    while (date.hasChildNodes()) { 
     date.removeChild(date.lastChild); 
    } 
    date = document.getElementById("date2"); 
    while (date.hasChildNodes()) { 
     date.removeChild(date.lastChild); 
    } 
} 

關鍵是,當我點擊提交按鈕時,我看不到表單序列化的動態元素,我想不會發送到服務器。

$(function(){ 
    $("#reportform").submit(function(event){ 
     event.preventDefault(); 
     alert(JSON.stringify($('form').serializeObject())); 
     return false; 
    }); 
}); 

這是可能的形式獲取這些動態字段? 在此先感謝

回答

0

似乎沒有新的創建輸入的「名稱」屬性。

+0

完全正確。我解決了它加入'input.name =「day」;'。謝謝。 – Spacemonkey