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

Question

I want to add a feature on my Django project using jQueryUI dialog box where when you click on a link (like a "delete" link) a jQueryUI dialog box will pop up asking you if you really want to delete that item. Then if you click on the delete button (found the jQuery dialog box) a Django function will do the delete job.

So how do I make the delete button (found the jQuery dialog box) send a post message (with respective variables) to a Django function found in my views.py that will do the delete job?

Real examples would be truly appreciated!

Answer 1

Say you have something like this in your template:

<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 %}

Then something like this (in your $(document).ready ) would work -- notice how we set the callback function that the dialog calls when the delete button is pressed (using the dialog's option method ) in the click handler:

$("#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;
});

Answer 2

You should also consider Aprise . It is lovely, uses jQuery, is easy to use, and is very small (3k).

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