jquery无法序列化通过ajax加载的表单中的数据

Question

已经漫长的夜晚在这里挣扎。

我有一个通过ajax加载到div的表单。

表单上的按钮使另一个Ajax调用串行化数据，但是当我调用serialise时，它不会获取表单数据。

我不明白为什么？

形式：

<form id="orderData"> 
     <table border="1" cellpadding="2" cellspacing="0" bordercolor="#d9d1cb" bgcolor="#666666" class="contact" style="margin-top:10px;"s="s"> 
      <tr> 
       <td colspan="2" bgcolor="#666666"><input type="text" name="name" id="name" style="width:250px; border:0;" class="required contact"/></td> 
       <td width="116" class="contact">Name:</td> 
      </tr> 
      <tr> 
       <td colspan="2" bgcolor="#666666"><input type="text" name="surname" id="surname" style="width:250px; border:0;" class="required contact"/></td> 
       <td class="contact"><label for="name">Surname:</label></td> 
      </tr> 
      <tr> 
       <td colspan="2" bgcolor="#666666"><input type="text" name="email" id="email" style="width:250px; border:0;" class="required email contact"/></td> 
       <td class="contact"><label for="email">Email:</label></td> 
      </tr> 
      <tr> 
       <td colspan="2" bgcolor="#666666"><input type="text" name="telephone" style="width:250px; border:0;" id="telephone" class="contact"/></td> 
       <td class="contact"><label for="telephone">Telephone:</label></td> 
      </tr> 
      <tr> 
       <td colspan="2" bgcolor="#666666"><input name="mobile" type="text" id="mobile" style="width:250px; border:0;" class="contact" /></td> 
       <td class="contact">Mobile:</td> 
      </tr> 

      <tr> 
       <td colspan="2" bgcolor="#666666"><textarea name="address" id="address" style="width:250px; height:50px; border:0; font-family:Arial, Helvetica, sans-serif;" cols="50" rows="2" class="required contact"></textarea></td> 
       <td valign="top" class="contact"><label for="address">Address:</label></td> 
      </tr> 
      <tr> 
       <td colspan="2" bgcolor="#666666"><input type="text" name="city" id="city" style="width:250px; border:0;" size="32" class="required contact"/></td> 
       <td class="contact"><label for="city">City:</label></td> 
      </tr> 
      <tr> 
       <td colspan="2" bgcolor="#666666"><input type="text" name="postcode" style="width:250px; border:0;" id="postcode" size="32" class="required contact"/></td> 
       <td class="contact"><label for="postcode">Postcode:</label></td> 
      </tr> 
      <tr> 
      <td colspan="2" align="right" valign="top" bgcolor="#666666"><select name="hearabout" id="hearabout" class="contact"> 
       <option value="Google">Google</option> 
       <option value="Other search engine">Other Search Engine</option> 
       <option value="ES Magazine">ES Magazine</option> 
       <option value="Telegraph">Telegraph</option> 
       <option value="Guardian Magazine">Guardian Magazine</option> 
       <option value="Passesd by">Passed By</option> 
       <option value="From a friend">From a friend</option> 
       <option value="Other">Other</option> 
      </select></td> 
      <td valign="top" class="contact">How did you hear about us?</td> 
      </tr> 

      <tr> 
       <td width="47" class="contact"><input name="send_email" type="hidden" value="send" /><input name="brochure" type="checkbox" id="brochure" value="1" /></td> 
       <td width="197" class="contact"><div align="left"><strong>Request Brochure:</strong></div></td> 
       <td class="contact"><input name="ordersamples" type="submit" class="button_contact" id="ordersamples" value="Order Samples" /></td> 
      </tr> 
     </table> 
     </form> 

附着在提交按钮Ajax调用：

$("body").delegate("#ordersamples", "click", function(e){ 
     e.preventDefault(); 
     var formData = $('#orderData').serializeObject(); 
      console.log(formData); 
     if (swatchArray.length <=0){ 
      //alert('no samples'); 
      jQuery.facebox('<table width="100%" border="0" cellspacing="2" cellpadding="2"><tr><td>No samples selected.<br>To select a fabric sample simply click once on it and your selection will appear in the samples panel at the right of the page.<br>When you have made your selection (maximum 7 samples), fill out the form and click on ‘Order Samples’</td></tr><tr><td></td></tr></table>'); 
      //Prevent the submit event and remain on the screen 

      return false; 
     } else { 
      //alert('has samples'); 
      var myUrl = 'sendswatch-data2.php'; 
      var formData = $('#orderData').serializeObject(); 
      console.log(formData); 
      $.ajax({ 
       url: myUrl, 
       data: {'swatchid[]':swatchArray, 'formdata':$('#orderData').serializeObject()}, 
       type: "POST", 
       error: function(xhr, statusText, errorThrown){ 
        // Work out what the error was and display the appropriate message 
       }, 
       success: function(myData){ 
        $('#tabsampleorder').html(myData); 
        $('.tabber').hide(); 
        $('#tabsampleorder').show(); 
       } 
      }); 
     } 
    }); 

，这里是我用连载的数据功能：

$.fn.serializeObject = function(){ 
     var o = {}; 
     var a = this.serializeArray(); 
     $.each(a, function() { 
      if (o[this.name] !== undefined) { 
       if (!o[this.name].push) { 
        o[this.name] = [o[this.name]]; 
       } 
       o[this.name].push(this.value || ''); 
      } else { 
       o[this.name] = this.value || ''; 
      } 
     }); 
     return o; 
    }; 

Answer 1

我确实说这是一个深夜！

笨/累我没有在表单中添加名称和它的工作！