jQuery-UI 对话框在 POST 数组中缺少 <button> 名称/值答案

【问题标题】：jQuery-UI Dialog missing <button> name/value in POST arrayjQuery-UI 对话框在 POST 数组中缺少 <button> 名称/值
【发布时间】：2011-10-19 04:16:32
【问题描述】：

我有一个 jQuery 对话框，当单击“请确认”按钮时会发布一个表单。

我看到了我的帖子数据，但按钮缺少其名称/值：

如何让它显示按钮名称/值？
所需结果示例

这是演示此行为的示例代码 testjQueryDialog.php：

<html><head>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    var $dialog = $('<div></div>')
        .dialog({
            autoOpen: false,
            title: 'Are you sure?',
            modal: true,
            closeOnEscape: true,
            buttons: {
                "Please confirm": function() {
                $( this ).dialog( "close" );
                $('#btnSubscription').parents('form').submit();
                },
                Cancel: function() {
                $( this ).dialog( "close" );
                }
            }
        });
    $('#btnSubscription').live('click', function() {
        $dialog.dialog('open');
        return false;
    });
});
</script>
</head><body>
<form action="/testjQueryDialog.php" method="post">
<div>
    <input name="txtOne" type="text" value="One">
  <input name="txtTwo" type="text" value="Two">
  <button name="btnSubmit" id="btnSubscription" value="Subscription">Click</button>
</div>
<?php echo 'POST<br>'; print_r($_POST); ?>
</form></body></html>

【问题讨论】：

标签： jquery jquery-ui jquery-ui-dialog

【解决方案1】：

HTML4 spec 声明：“如果一个表单包含多个提交按钮，只有激活的提交按钮是成功的。”

看起来浏览器忽略了表单只有一个提交按钮的事实，并且由于您通过$('#btnSubscription').parents('form').submit()动态触发表单提交，因此按钮不被视为成功控件。

问题出在按钮click回调：

$('#btnSubscription').live('click', function() {
    $dialog.dialog('open');
    return false;
});

当回调返回false时按钮激活丢失，你需要根据用户的选择返回一个值：Returning value from confirmation dialog using JQuery UI dialog

【讨论】：

Artem：感谢您的回复。您提供的链接显示了一种使用传播的方法，但没有回答我的问题。我试过了，它给出了相同的结果：我可以在帖子数据中看到其他表单输入值/对，但看不到
正确传播的事件应该保留激活的按钮值。如果您提供您尝试过的代码，我可以尝试检查问题所在。

【解决方案2】：

似乎 jQueryUI 对话框有点损坏，因为它不返回按钮名称/值对。

我的解决方法是在表单中添加一个隐藏字段，并使用它来传递按钮值。

$('#btnSubscription').live('click', function() {
    document.getElementById('hidSubmit').value = document.getElementById('btnSubscription').value
    $dialog.dialog('open');
    return false;
});

现在我想要的结果如下所示：数组（[txtOne] => 一个 [txtTwo] => 两个 [hidSubmit] => 订阅）

【讨论】：