Question

我试图使用通常在表单上使用的jQuery.serialize（）函数来序列化div中的数据。

我无法使用表单标记，因为我在asp.net webforms中工作，它将所有内容包装在表单中，因此嵌套表单不起作用。

这是我的js代码：

$('div.request input.submit-button').on('click', function () {
var form = $(this).parent();

            $.ajax({
            type: "POST",
            url: '/API/InfoRequest.ashx',
            data: $(form).serialize(),
            dataType: "text",
            success: function (response) {           

            }
        })
});

但$（form）.serialize（）返回一个空字符串。

这是HTML：

<div role="form" id="sidebar-form"  class="request">
<div class="form-group has-feedback">
    <label for="name3">Nome</label>
    <input type="text" class="form-control" id="name3" placeholder="Nome e Cognome" name="name3">
    <i class="fa fa-user form-control-feedback"></i>
</div>
<div class="form-group has-feedback">
    <label for="email3">Email</label>
    <input type="email" class="form-control" id="email3" placeholder="Indirizzo Email" name="email3">
    <i class="fa fa-envelope form-control-feedback"></i>
</div>
<div class="form-group">
    <label>Categoria</label>
    <select class="form-control" id="category">
        <option value="Sales">Vendita</option>
        <option value="Support">Tecnica</option>
        <option value="Lorem">Logistica</option>
        <option value="Ipsum sit">Ipsum sit</option>
        <option value="Dolor amet">Dolor amet</option>
    </select>
</div>
<div class="form-group has-feedback">
    <label for="message3">Messaggio</label>
    <textarea class="form-control" rows="4" id="message3" placeholder="" name="message3"></textarea>
    <i class="fa fa-pencil form-control-feedback"></i>
</div>
<input type="button" value="INVIA" class="submit-button btn btn-primary">
</div>

我想只检索表单字段，例如input，select，textarea，将它们作为urlencoded格式发布，然后在被调用的ASHX处理程序中读取它们。

是否可以使用serialize（）？

Answer 1

尝试

$('#sidebar-form :input, #sidebar-form textarea,  #sidebar-form select').serialize();

或者

$("#sidebar-form").find("select, textarea, input").serialize()

Answer 2

你必须为那个

建立自己的功能

function formSerializer(selector){
  data="";
   // look for every form field
  selector.find('input, select, textarea').each(function(){
     // serialize data
    data+=$(this).attr("name")+"="$(this).val()+"&";
  });
// remove the last & char
return data.replace(/&$/g,"");
}

函数调用

$.ajax({
        type: "POST",
        url: '/API/InfoRequest.ashx',
        data: formSerializer(form),
        dataType: "text",
        success: function (response) {           

        }
    })

jquery序列化div内容以发布输入数据

2 个答案: