Django/Jquery UI 对话框 - 如何将 Django 与 JqueryUI 对话框集成？

Posted 2023-02-24

【中文标题】Django/Jquery UI 对话框 - 如何将 Django 与 JqueryUI 对话框集成？

【英文标题】：Django/JqueryUI dialog box - How can I integreate Django with JqueryUI dialog box?

【发布时间】：2011-09-13 11:46:25

【问题描述】：

我想使用jQueryUI dialog box 在我的 Django 项目中添加一个功能，当您单击链接（例如“删除”链接）时，会弹出一个 jQueryUI 对话框，询问您是否真的要删除该项目。然后，如果您单击删除按钮（找到 jQuery 对话框），Django 函数将执行删除工作。

那么，如何让删除按钮（找到 jQuery 对话框）向我的 views.py 中的 Django 函数发送一条发布消息（带有相应的变量）来执行删除工作？

真正的例子将不胜感激！

【参考方案1】：

假设您的模板中有这样的内容：

<div id="dialog" title="Confirm delete">Are you sure?</div>
% for object in object_list %
# display whatever you like here
<a id=" object.id " class="delete" href="#">Delete</a>
% endfor %

然后像这样（在您的$(document).ready 中）将起作用——注意我们如何在click 处理程序中设置当按下删除按钮时对话框调用的回调函数（使用对话框的option method）：

$("#dialog").dialog(
    modal: true,
    autoOpen: false
);
$("a.delete").click(function(e) 
    e.preventDefault();
    var id = $(this).attr('id');
    $("#dialog").dialog('option', 'buttons', 
        "Delete": function() 
            $.post(
                url: % url myapp.views.delete %,
                data: 'id': id,
                success: function() 
                   # whatever you like, some fancy effect that removes the object
                
            );
            $(this).dialog("close");
        ,
        "Cancel": function() 
            $(this).dialog("close");
        
    );
    $("#dialog").dialog("open");
    return false;
);

【讨论】：

感谢您的快速回复。任何想法如何将 ID 添加到对话框“删除”按钮？我在同一页面上有多个表单，我区分发布请求来自什么表单的方式是通过识别按钮 ID 如下：如果 request.POST 中的“my_button_id”：...然后做一些事情...

【参考方案2】：

您还应该考虑Aprise。它很可爱，使用 jQuery，易于使用，而且非常小（3k）。

apprise('Hello now?', 'verify':true);