从 jQuery 对话框中加载的页面中检索选定的值答案

【问题标题】：Retrieve the selected values from a page loaded in jQuery Dialog从 jQuery 对话框中加载的页面中检索选定的值
【发布时间】：2012-03-30 05:44:34
【问题描述】：

我正在尝试从通过 jQuery 对话框加载的页面中检索选定的值。

以下是详细信息 - 一旦“SelectTeam.php”页面加载到对话框（已通过一些默认选择），一旦用户单击对话框的“确定”按钮，我想检索新的选择，因为用户可以覆盖默认选择，然后按 OK。我应该如何在按下“确定”按钮时获得新的选择。

父页面-

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>jQuery UI Dialog Example</title>
    <link type="text/css" href="css/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" /> 
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script>
    <style>
            body { font-size: 62.5%; }
    </style>
    <script type="text/javascript">
        function openDialog(url) {
           $("#somediv").load(url).dialog({
                                            modal:true,
                                            title: 'Team Select',
                                            width: 300,
                                            height: 400,
                                            autoOpen: true,
                                            resizable: false,
                                            buttons: {
                                                "OK": function() {
                                                    $(this).dialog("close");
                                                },
                                                "Cancel": function() {
                                                    $(this).dialog("close");
                                                }
                                            }
                                            });
        } 
    </script>
</head>
<body>
    <div id="somediv"></div>
    <a href="#" onclick="openDialog('SelectTeam.php?TeamIds=2,4,13');">Dialog</a>
</body>
   </html>

在 jQuery 对话框中加载的子页面 -

 <?php

$lstTeamId = array();

if (isset($_GET['TeamIds']))
{
$lstTeamId = explode(',', $_GET['TeamIds']);
}
?>

<!DOCTYPE html>
<html>
<body>
    <form id="frmSelectTeams">

        <table width="100%" border="1">
             <tr>
                <th align="center"><input type="checkbox" disabled="disabled"/></th>
                <th align="center">Team Name</th>
             </tr>

            <?php
            for ($index = 1; $index < 21; $index++)
            {
                echo '<tr>';
                echo '<td align="center"><input type="checkbox" class="test" name="chk' . $index . '" '; if (in_array ($index, $lstTeamId)) { echo 'checked="checked"';} echo ' /></td>';
                echo '<td align="center">Team ' . $index . '</td>';
                echo "</tr>";
            }
            ?>

        </table>
    </form>
</body>
</html>

【问题讨论】：

你的复选框应该是单选按钮，如果你只想要一个选择......？它们的值应该等于您要选择的值，即新的选择 url？

标签： php jquery html jquery-ui

【解决方案1】：

你不能用新选择的 url 再次调用 openDialog(url) 吗？

buttons: {
   "OK":      function() 
                new_url = 'new_selection_url';
                openDialog(new_url);
              },
   "Cancel": function() {
               $(this).dialog("close");
             }
}

编辑：我不太确定您希望在哪里显示选择。新选择必须在对话框中吗？在对话框之外？

更新：好的，看起来您想将其加载到#somediv 中。只需再次调用 load：

buttons: {
   "OK":      function() 
                new_url = 'new_selection_url';
                $('#somediv').load(new_url);
              },

更新：如果您只想选择一个网址，则必须使用单选按钮。要获取所有选中复选框的值，您可以尝试以下操作：

var urls = [];
$('.test :checked').each(function() {
   urls.push($(this).val());
 });
new_url = urls[0];

如果你用单选按钮替换复选框，你可以试试这样：

new_url = $('input[name=radioName]:checked', '#frmSelectTeams').val()

【讨论】：