3

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

显示用户的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>

当您单击用户名时，它会打开一个带有jQ​​uery UI的对话框，这是处理该问题的jQuery代码：

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

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

当然，这会打开对话框并且工作得很好。但是，我不确定如何设置 div 以在对话框打开时正确显示用户信息。此外，我希望能够向用户的帐户提交更改，但我不确定如何将用户的 ID 提交给表单处理器，以便它知道要修改哪个用户。

我已经在谷歌上搜索了一段时间，发现了许多类似的线程，但没有一个真正涵盖这一点。

4

2 回答 2

2

创建你的#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 变量（如果您使用它们并在提交之前设置到表单中）。

于 2012-07-29T15:31:51.707 回答
1

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

然后，在打开 div 之前，调用$('#stufftochange').html("user's info here");动态更改其内容，然后$('#editUser').dialog('open');

于 2012-07-29T15:05:51.650 回答