我有一个表单有几个元素和两个提交按钮,一个是“保存”,另一个是“删除”。在“删除”按钮上,我使用jQuery对话框确认用户想要删除。如果他们确认,我提交表格。问题是jQuery.submit()在发布时不包括原始的提交按钮,所以我无法在服务器上区分删除保存,因为它们都使用相同的表单。如果我删除jQuery对话框,则按预期发布提交按钮值。这个很常见,我希望有人可以分享解决方案。我已经四处寻找,找不到任何有用的东西(难道只是我或谷歌最近吸吮?)
感谢您的帮助......
修改
提交按钮确实设置了名称和值。如果不使用jQuery.submit()
,它工作正常答案 0 :(得分:17)
基于karim79的回答:
$("input[type=submit], input[type=button], button").click(function(e) {
var self= $(this),
form = self.closest(form),
tempElement = $("<input type='hidden'/>");
// clone the important parts of the button used to submit the form.
tempElement
.attr("name", this.name)
.val(self.val())
.appendTo(form);
// boom shakalaka!
form.submit();
// we don't want our temp element cluttering up the DOM, do we?
tempElement.remove();
// prevent default since we are already submitting the button's form.
e.preventDefault();
});
更新:
我刚刚意识到上面的代码可能不是你想要的:
如果您在表单元素本身($("form").submit();
)上调用submit,则需要这样的内容:
$("form").submit(function(){
var form = $(this);
$("input[type=submit], input[type=button], button", form).eq(0).each(function(){
var self= $(this),
tempElement = $("<input type='hidden'/>");
// clone the important parts of the button used to submit the form.
tempElement
.attr("name", this.name)
.val(self.val())
.appendTo(form);
});
});
这将在提交表单之前将第一个按钮元素的名称和值添加到DOM(我不确定这里的默认浏览器行为是什么)。请注意,这不会从DOM中删除tempElement
。如果出现错误并且表单未提交,则该元素将保留,如果您不处理此问题,则会遇到问题。
答案 1 :(得分:3)
提交按钮数据仅在单击时提交。如果有人按下回车而不是点击提交按钮,那么你也会失败。
我强烈建议从表单中删除删除按钮,因为它可能不需要大部分表单的信息(只有您要删除的数据记录的ID),将其更改为按钮(带有type="button"
)提交不同的表单,或者,如果可以的话,在那里添加链接。 (链接到删除页面 - 无论如何,这更好地出于可用性原因,因为它会从删除选项中删除焦点,并降低用户意外点击删除按钮的风险。)
答案 2 :(得分:1)
这种事情可以通过以某种方式结合“动作”参数来解决,它告诉服务器提交的目的是什么。例如,假设您的表单是通过GET提交的:
$("form :input").click(function() {
var $form = $(this).closest("form");
var submitTo = $form.attr("action") + '?action=' + $(this).val();
alert(submitTo);
// window.location.href = submitTo;
return false;
});