Javascript提交不包括提交按钮值

时间:2009-11-10 16:34:52

标签: javascript form-submit

好吧,这不仅仅是我的信息问题(因为我可以想到4种不同的工作方式可以使它工作。但我有一个表格(没什么特别的)但提交按钮有与之相关的特定值。

<input type='submit' name='submitDocUpdate' value='Save'/>

表单提交后,我会检查该名称。

if(isset($_POST['submitDocUpdate'])){ //do stuff

但是,有一次我试图通过Javascript提交表单,而不是提交按钮。

document.getElementById("myForm").submit();

哪个工作正常,除了1个问题。当我查看通过javascript方法提交的$ _POST值时,它不包括submitDocUpdate。我得到表单的所有其他值,但不是提交按钮值。

就像我说的,我可以想办法解决它(使用隐藏变量,在另一个表单变量上检查isset等),但我只是想知道这是否是submit()的正确行为,因为这对我来说似乎不太直观。提前谢谢。

7 个答案:

答案 0 :(得分:30)

是的,这是HTMLFormElement.submit()

的正确行为

未发送提交按钮值的原因是因为HTML表单的设计是为了发送单击(或以其他方式激活)的提交按钮的值。这允许每个表单有多个提交按钮,例如您需要“预览”和“保存”操作的场景。

由于您是以编程方式提交表单,因此单个提交按钮上没有明确的用户操作,因此不会发送任何内容。

答案 1 :(得分:11)

使用jQuery 1.0或更高版本:

$('input[type="submit"]').click();

当我偶然发现这篇文章时,我实际上正在解决同样的问题。不带任何参数的click()会在您选择的任何元素上触发click事件:http://api.jquery.com/click/

答案 2 :(得分:7)

为什么不使用以下内容?

<input type="hidden" name="submitDocUpdate" value="Save" />

答案 3 :(得分:2)

用户单击按钮时会提交提交按钮值。调用form.submit()不是单击按钮。您可能有多个提交按钮,而form.submit()函数无法知道您要将哪一个发送到服务器。

答案 4 :(得分:1)

虽然这个被认可的答案在技术上是正确的。有一种方法可以传递您想要分配的价值。事实上,当from被提交到服务器时,提交按钮的值与您提交按钮的名称相关联。那就是Marcin的诀窍是如何工作的,你可以通过多种方式取决于你的使用方式。防爆。在jQuery中你可以传递

data: { 
    submitDocUpdate = "MyValue" 
}
在MVC中我会使用:

@using (Html.BeginForm("ExternalLogin", "Account", new { submitDocUpdate = "MyValue" }))

这实际上是我遵守使用oAuth使用自己的图像作为登录链接的蒸汽要求:

@using (Html.BeginForm("ExternalLogin", "Account", new { provider = "Steam" }, FormMethod.Post, new { id = "steamLogin" }))
{
     <a id="loginLink" class="steam-login-button" href="javascript:document.getElementById('steamLogin').submit()"><img alt="Sign in through Steam" src="https://steamcommunity-a.akamaihd.net/public/images/signinthroughsteam/sits_01.png"/></a>
}

答案 5 :(得分:1)

理解行为是好的,但这里有一些代码可以解决我在jquery和php中的问题,其他人可以适应。实际上,这是一个更复杂的系统,它在单击删除按钮时会显示一个引导模态确认。

TL; DR 输入打扮得像个按钮。点击后将其更改为hidden input

<强> HTML

<input
    id="delete" 
    name="delete" 
    type="button" 
    class="btn btn-danger"
    data-confirm="Are you sure you want to delete?"
    value="Delete"></input>

<强> jquery的

$('#delete').click(function(ev) {
        button.attr('type', 'hidden');
        $('#form1').submit();
    return false;
});

<强> PHP

if(isset($_POST["delete"])){
    $result = $foo->Delete();    
}

答案 6 :(得分:0)

这是一个在没有任何外部库的情况下在所有浏览器中都能正常运行的想法。

HTML代码

<form id="form1" method="post" >
    ...........Form elements...............
    <input type='button' value='Save' onclick="manualSubmission('form1', 'name_of_button', 'value_of_button')" />
</form>

Java脚本

在关闭body标签之前放置此代码

<script type="text/javascript">
    function manualSubmission(f1, n1, v1){
    var form_f = document.getElementById(f1);
    var fld_n = document.createElement("input");
    fld_n.setAttribute("type", "hidden");
    fld_n.setAttribute("name", n1);
    fld_n.setAttribute("value", v1);
    form_f.appendChild(fld_n);
    form_f.submit();
}
</script>

PHP代码

<?php if(isset($_POST['name_of_button'])){

       // Do what you want to do.
}
?>

注意:请不要将按钮“提交”命名为“提交”,因为这可能会导致浏览器不兼容。