2009-08-16 112 views
1

混淆我目前在一个AJAX请求中使用form.serialize()提交联系表单,但我的问题是form.serialize()抓住包括“按钮”在内的所有表单元素。与.serialize()和.serializeElements()

示例形式:

name (input type = text) 
email (input type = text) 
body (text area) 
submit (input type = button) 
clear (input type = reset) 

我只希望序列化形式元件,其类型的按钮NOT,RESET或密码。

有没有一个简单的解决方案呢?

+0

你能复制(或链接到)你的表单html代码和serialize()调用的实际结果吗? – Zed 2009-08-16 20:45:38

回答

3

我希望如果你省略了按钮输入的name参数,按钮将不会被序列化。我的期望是基于这样一个事实,即序列化应该模仿表单在提交时序列化的方式,而没有名称的输入不会作为表单参数发送。我编写了一个简单的测试,这似乎表明了这一点。点击检查按钮,你会得到“text = bob”。切换复选框,你会得到“cb2 = on & text = bob”。提交按钮的值从不包括在内。

<script type="text/javascript"> 
    $(document).observe('dom:loaded', function() { 
     $('btn').observe('click', function() { 
      alert($('form').serialize()); 
      return false; 
     }); 
    }); 
</script> 
</head> 
<body> 
<form id='form'> 
Checkbox 1 <input type="checkbox" id="cb1" name="cb1" /> 
Checkbox 2 <input type="checkbox" id="cb2" name="cb2" /><br /> 
<input type='text' name='text' value='bob' /> 
<input type="submit" id="btn" value="Examine" /> 
</form> 
+0

是的,这就是它!默认情况下不带“name”参数表单字段将被忽略 – SkyLar 2009-08-17 14:31:20

+0

您可能希望接受此为答案,因为它解决了您的问题。这将让其他人知道(谁不读你的评论)这是解决方案。 – tvanfosson 2009-08-17 14:48:55

0

这是一个有点胡乱猜测的,而且很可能不是唯一的解决办法,但一个我正在考虑的方法是:

在代码中,所以这样mething可能会做:

Form.serializeElements(
    // We need the list of all elements 
    // that are not rejected by the inner function 
    $('YOUR_FORM_ID').getElements().reject(function (formElement) { 
     // this function must return : 
     // - true for an element that you want to keep 
     // - false for an element you don't want to keep (you have to return false for your buttons, for instance) 
     if (formElement.type == 'radio' || formElement.type == 'checkbox') { 
      return false; 
     } else { 
      return true; 
     } 
    }) 
); 

和输出(你会想要捕捉到一个变量,当然),是财产以后这样的:

"lol=15&dt=0" 

和/或你可以使用第二个可选的参数Form.serializeElements,如果你想获得一个哈希/一个对象,而不是查询字符串。


注:在这个例子中,我并没有过滤掉你指定的元素:我用来测试的形式没有你问什么了,所以我过滤掉了一些其他的东西。因此,你将不得不适应函数中的条件。


希望得到这个帮助;玩的开心 !

+0

我不是一个原型人,但它看起来像你可以使用CSS3选择器 - 可能值得一试。 http://overfloweb.com/blog/index.php/archives/11 – 2009-08-16 20:51:17