Использование привязки шаблона KnockoutJS с диалоговым окном подтверждения jQuery
Как я могу использовать диалоговое окно JQuery UI, чтобы подтвердить, хотите ли они удалить строку из списка в шаблоне KnockoutJS?
Как я вижу, демоверсии Knockout показывают шаблон, который отображает каждую строку в сетке.
Кнопка удаления вызывает функцию viewModel.remove()
, проходящую в объекте строки для удаления. Внутри функции remove()
вызывается this.Gifts.Remove()
с данными, переданными в функцию в качестве параметра.
Моя проблема в том, что я хочу отобразить диалог jQuery, чтобы попросить подтвердить, следует ли удалить строку. Диалоговое окно JQuery работает на основе функции настройки, которая заранее устанавливает диалог и функцию удаления.
Когда я нажимаю ссылку на удаление в шаблоне, открывается диалоговое окно ok, но как передать данные шаблона в функцию удаления диалога, так как теперь она полностью отделена от механизма шаблона?
Ответы
Ответ 1
Я предполагаю, что это диалог из jQuery UI. Если это так, то ваше удаление будет выглядеть примерно так:
removeItem: function(item) {
$( "#dialog-confirm" ).dialog({
resizable: false,
height:140,
modal: true,
buttons: {
"Delete item": function() {
$(this).dialog("close");
viewModel.items.remove(item);
},
Cancel: function() {
$(this).dialog("close");
}
}
});
}
Итак, кнопка "Удалить элемент" закроет диалоговое окно, а также удалит ваш элемент из вашего наблюдаемого массива.
Рабочий пример здесь: http://jsfiddle.net/rniemeyer/CLxsV/
Изменить: лучший пример с использованием привязок здесь: http://jsfiddle.net/rniemeyer/WpnTU/