如何将jQuery变量传递给通过对话框打开的DIV

Question

我正在为我的一个网站开发用户管理面板，我正在尝试找出如何正确地将所有正确的信息传递给对话框。

显示用户的HTML代码如下：

<table>
  <tr>
    <td>{$v.id}</td>
    <td><a href="#" class="editUser" data-userid="{$v.id}">{$v.username}</a></td>
    <td>{if $smarty.now - $v.last_active <= 900}<span style="color: green;">Online</span>{else}<span style="color: #e61e1e;">Offline</span>{/if}</td>
    <td>{$v.email}</td>
    <td>{$v.time}</td>
    <td>{$v.notes}</td>
    <td align="center"><input name="delete" type="checkbox"/></td>
  </tr>
</table>

当您点击用户名时，它会使用 jQuery UI 打开一个对话框，这是处理此操作的jQuery代码：

   $('a.editUser').click(function(){
        $('#editUser').dialog('open');
        //var userID = $(this).data('userid');
        //var username = $(this).attr('title');
        //$('#editUser').html(userID);
   });

非常简单。被注释的代码是我用来测试确保它能区分用户的。

当然，这会打开对话框并正常工作。但是，我不知道如何设置div以在对话框打开时正确显示用户信息。此外，我希望能够提交更改到用户账户，但我不知道如何将用户ID提交给表单处理器，使其知道要修改哪个用户。

我已经搜索了一段时间，并找到了许多类似的线程，但没有一个真正涵盖这个问题。

- Rob

---

对话框的代码在哪里？先展示给我看，然后我会看看如何帮助你。 - A Person

@siidheesh http://jqueryui.com/download - Rob

你能发布 #editUser html 的代码吗？ - afrin216

@Afrin，现在这只是一个<div id="editUser">测试</div>，直到我找到最好的方法来处理它。 - Rob

Answer 1

创建一个 #editUser 的 div，使用以下代码：

<div id="editUser">
<span id="username"></span>
</div>

在您的函数中，在调用 dialog 函数之前，使用点击用户的信息填充对话框。

$('a.editUser').click(function(){
        $("#username").html($(this).data('userid'));
        $('#editUser').dialog('open');
        //var userID = $(this).data('userid');
        //var username = $(this).attr('title');
        //$('#editUser').html(userID);
   });

现在，在其他地方创建您的表单并添加隐藏变量。在提交按钮上，调用一个 JavaScript 函数，该函数将从上述 ID（如 $（“＃username”））或使用 JS 变量（如果有）提取信息，并在提交之前设置到表单中。

- afrin216

Answer 2

好的，既然对话框 div 与上面的代码在同一个文档中，您可以在对话框的 div 中添加一个已知 id 的 div，例如 <div id="stufftochange"></div>。

然后，在打开 div 之前，调用 $('#stufftochange').html("用户信息在此"); 动态更改其内容，然后 $('#editUser').dialog('open');

- A Person