如何根据表单的文本输入准备值列表？答案

【问题标题】：How to prepare a list of values based on a form's text inputs?如何根据表单的文本输入准备值列表？
【发布时间】：2012-05-02 12:27:14
【问题描述】：

给定以下形式：

<form class="email-form" action="" method="PUT" data-remote="true" data-method="put">
  <ul>
    <li>
      <label for="sEmail1">
        <input type="text" id="sEmail1" name="emails[]" value="d@google.com"
               placeholder="">
      </label>
    </li>
    <li>
      <label for="sEmail2">
        <input type="text" id="sEmail2" name="emails[]" value="d2@google.com"
               placeholder="">
      </label>
    </li>
    <li>
      <label for="sEmail3">
        <input type="text" id="sEmail3" name="emails[]" value="d3@google.com"
               placeholder="">
      </label>
    </li>
  </ul>
  <button type="submit">Continue</button>
</form>

如何使用查询获取完整的电子邮件列表并将其发布到 rails 如下：

Parameters: {"emails"=>{"list"=>["d@google.com", "d2@google.com","d2@google.com"]}}

我有以下几点：

    $.ajax({
        type: 'POST',
        url: '/send_invites',
        data: {
            emails : {
                list : $('.email-form').serialize()
            },
            _method : 'PUT'
        },
        success : function() {
        }
    });

【问题讨论】：

标签： javascript jquery ajax arrays forms

【解决方案1】：

试试这个：

emails = new Object();
emails.list = [];
i = 0;

$("input[name^='email']").each(function(){
   if(i < 3) {
    emails.list[i] = $(this).val();
    i++
  }

})

alert(JSON.stringify(emails));

或：

parameters = new Object();
parameters.emails = new Object()
parameters.emails.list= [];
i = 0;

$("input[name^='email']").each(function(){
   if(i < 3) {
    parameters.emails.list[i] = $(this).val();
    i++
  }

})

alert(JSON.stringify(parameters));

http://jsfiddle.net/jgjpD/1/

【讨论】：

【解决方案2】：

通过扩展 jQuery 并添加 serializeObject 方法，这是一个 quick way to serialize a form。

$(function() {

    //form to object
    $.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;
    };

    //test it out
    $('form').on('submit', function() {
        var serialized = $(this).serializeObject();

        console.log(serialized);
        console.log(JSON.stringify(serialized));

        return false;
    });

});

【讨论】：

【解决方案3】：

这是一种方法

var listval = [];
$("input['name=emails\[\]']").each(function() {
    listval.push($(this).val());
}

【讨论】：