Диалоговое окно Django/JqueryUI — как я могу интегрировать Django с диалоговым окном JqueryUI?

Я хочу добавить функцию в свой проект Django, используя диалоговое окно jQueryUI, где при нажатии по ссылке (например, по ссылке «удалить») появится диалоговое окно jQueryUI с вопросом, действительно ли вы хотите удалить этот элемент. Затем, если вы нажмете кнопку удаления (найдете диалоговое окно jQuery), функция Django выполнит задание по удалению.

Итак, как мне сделать, чтобы кнопка удаления (нашла диалоговое окно jQuery) отправляла сообщение (с соответствующими переменными) в функцию Django, найденную в моем views.py, которая будет выполнять задание по удалению?

Буду признателен за реальные примеры!


django jquery django-forms django-views jquery-ui
person avatar    schedule 12.06.2011    source источник

Ответы (2)


arrow_upward
9
arrow_downward

Скажем, у вас есть что-то вроде этого в вашем шаблоне:

<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:

$("#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;
});
person Ismail Badawi    schedule 12.06.2011
comment
Спасибо за быстрый ответ. Любые идеи, как добавить идентификатор в кнопку удаления диалога? У меня есть несколько форм на одной странице, и способ, которым я различаю форму, из которой поступил запрос на публикацию, заключается в определении идентификатора кнопки следующим образом: если 'my_button_id' в request.POST: ... затем сделайте что-нибудь... - person avatar; 13.06.2011

arrow_upward
2
arrow_downward

Вы также должны рассмотреть Aprise. Он прекрасен, использует jQuery, прост в использовании и очень мал (3 КБ).

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

диалоговое окно начала

person Gourneau    schedule 26.06.2011