jquery form serialize() 只返回部分字段答案

【问题标题】：Jquery form serialize() returns only some of the fieldsjquery form serialize() 只返回部分字段
【发布时间】：2014-08-12 09:51:35
【问题描述】：

我在 jQuery 中遇到了表单的 serialize() 函数问题。当我尝试通过 AJAX 提交我的序列化表单时，serialize() 返回几个字段的值。某些值不会保留。

也许我的 HTML 大纲或 jQuery 有问题：

<div id="register" class="row callout panel">
  <div class="large-12 medium-12">
    <form name="signupform" id="signupform" method="post" data-abide="ajax">
      <div class="row text-center">
        <span class="radius"> <span class="fi-clipboard-pencil medium"></span> Please Register </span>
      </div>
      <br>
      <div class="large-5 medium-8 columns small-centered large-centered">
        <div class="row">                  
          <div class="large-12 columns">
            <label for="user">Faculty Name <small>required</small>
              <input type="text" id="user" placeholder="Please Type your Full Name" required>
              </label>
              <small class="error">This field is required.</small>
            </div>

            <div class="large-11 columns">
              <label for="username">User Name <small>required</small>
                <input type="text" id="username" placeholder="Please enter your RGUKT email id" required pattern="^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@(rgukt.in|RGUKT.IN)">
              </label>                    
              <small class="error">UserName must be RGUKT Email id.</small>
            </div>
            <div class="large-1 columns"> &nbsp;
              <label for="user-result">
              <span id="user-result"></span>
              </label>                    
            </div> 

            <div class="large-12 columns">
              <label for="password">Password <small>required</small>
                <input type="password" id="password" placeholder="Choose a strong password." name="password" required>
              </label>
              <small class="error">Must be at least 8 characters with 1 capital letter, 1 number, and one special character.</small>
            </div>

            <div class="large-12 columns">
              <label for="confirmPassword">Confirm Password <small>required</small>
                <input type="password" id="confirmPassword" placeholder="Again type your password." name="confirmPassword" required data-equalto="password">
              </label>
              <small class="error">Passwords must match.</small>
            </div>
          </div>

          <div class="row">
           <div class="large-6 columns">
            <div class="row collapse">
              <label for="dept">Department <small>required</small>
                <select id="dept" class="" required>
                  <option value="">Select your Department </option>
                  <option value="CHE">Chemical Engg.</option>
                  <option value="CSE">Computer Science Engg.</option>
                  <option value="CE">Civil Engg.</option>
                  <option value="ECE">Electronics & Communications Engg.</option>
                  <option value="ME">Mechanical Engg.</option>
                  <option value="MME">Material Science & Metallurgical Engg.</option>
                </select>
              </label>
              <small class="error">Choose Department.</small>
            </div>
          </div>
          <div class="large-6 columns">
            <div class="row collapse">
              <label for="campus">RGUKT Campus <small>required</small>
                <select id="campus" class="" required>
                  <option value="">Select your Campus </option>
                  <option value="BAS">Basara</option>
                  <option value="NUZ">Nuzvid</option>
                  <option value="RKV">R K Valley</option>
                </select>
              </label>
              <small class="error">Choose RGUKT Campus.</small>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="large-6 columns">
            <div class="row collapse">
              <label for="eid">Employee ID 
                <input type="text" id="eid" placeholder="Employee ID." name="eid">
              </label>
            </div>
          </div>                                    
          <div class="large-6 columns">
            <div class="row collapse">
              <label for="phone">Mobile No. <small>required</small>
                <input type="tel" id="phone" placeholder="Contact Number" name="phone" required>
              </label>
            <small class="error">must be a reachable mobile.</small>
          </div>
        </div>
      </div>

      <div class="row">
        <div id="show" class="">
          <button type="submit" class="button">Complete Signup</button>
        </div>
      </div>     
    </div>

  </form>            
</div>

jQuery如下。

$('#signupform').on('valid.fndtn.abide', function() {

  signupData = $('#signupform').serialize();
  alert(signupData);
  $.ajax({
    url: 'include/signup.php',
    type: 'POST',
    data: signupData,
    cache: false,
    contentType: false,
    success: function (returndata) {
      alert('success');
      alert(returndata);
    }
  });   
  return false;
});

【问题讨论】：

标签： javascript jquery ajax forms serialization

【解决方案1】：

您的输入字段缺少name，例如：

<input type="text" id="user" placeholder="Please Type your Full Name" required>

形成docs：

对于要包含在序列化字符串中的表单元素的值，该元素必须具有名称属性。

【讨论】：

谢谢。现在我意识到了。

【解决方案2】：

一些输入缺少name 属性。

来自Documentation：

对于要包含在序列化字符串中的表单元素的值，该元素必须具有 name 属性

【讨论】：