mvc ajax.actionlink с диалоговым окном jquery подтвердить

У меня есть таблица с несколькими строками элементов данных. Для каждой строки будет несколько ссылок действий, которые будут вызывать некоторые методы (удалить элемент данных, изменить элемент данных состояния и т. д.).

Прежде чем каждый пользователь нажмет кнопку, я хочу, чтобы диалоговое окно jquery отображалось и давало пользователю диалоговое окно с некоторой информацией, кнопкой «ОК» и «Отмена».

Некоторый пример кода ajax.actionlink, который вызовет метод ChangeStatus:

<%= Ajax.ActionLink(item.Status, "ChangeStatus", new { id = item.Id }, new AjaxOptions { UpdateTargetId = "ListReturns-Div", OnBegin = "StartChangeStatus", OnSuccess = "EndChangeStatus", OnFailure = "FailureChangeStatus" }, new { @class = "StatusBtn" })%>

Это функция jquery, которая вызывается:

 function StartChangeStatus(e) {
            $('#dialog-confirm').dialog({
                resizable: false,
                height: 200,
                modal: true,
                buttons: {
                    'Continue': function () {
                        $(this).dialog('close');
                        $('#Loading-Div').show('slow');
                    },
                    Cancel: function () {
                        $(this).dialog('close');
                        e.preventDefault();
                    }
                }
            });
        }

Функции actionlink и jquery работают. Но проблема в том, что я не могу приостановить/остановить текущее действие при нажатии на ссылку действия. Теперь, когда кнопка нажата, запускается процесс отверстия, а кнопка подтверждения в диалоговом окне игнорируется. Итак, мой вопрос заключается в том, как изменить actionlink или функцию jquery, чтобы они работали по желанию с подтверждением в диалоговом окне, прежде чем продолжить?


jquery asp.net-mvc actionlink jquery-ui-dialog
person Webking    schedule 03.06.2010    source источник
comment
если вам когда-нибудь понадобится диалоговое окно подтверждения для типа ввода: отправить, вы можете использовать его отсюда awesome.codeplex. ком   -  person Omu    schedule 10.10.2010

Ответы (2)


arrow_upward
4
arrow_downward

Я также пробовал ваш код, получая такое же поведение. Я изменил ваш код, чтобы отобразить окно подтверждения.

<%= Ajax.ActionLink("Link", 
                    "ChangeStatus", 
                    new { id = 3 }, 
                    new AjaxOptions { UpdateTargetId = "ListReturns-Div", 
                                      HttpMethod = "Post", 
                                      Confirm = "confirmClick" }, 
                                      new { @class = "StatusBtn" }
                   )
%>

и он отображает подтверждение javascript. Нужно найти причину, почему он не работает.

person Elangovan    schedule 03.06.2010
comment
Так просто, должен быть выбран ответ - person jonprasetyo; 01.04.2015

arrow_upward
2
arrow_downward

С моего веб-сайта:

Теперь Ajax.ActionLink действительно полезен, а Confirm AjaxOption еще более... тем не менее, кому нужны эти дерьмовые оповещения Javascript в наши дни? Я разрабатываю приложение с Ms MVC 2 и использую фантастическую библиотеку JQueryUI для настройки визуальных эффектов всех моих элементов. Одна из лучших вещей, которые есть в JQueryUI, это диалоговые окна... типа "Вы уверены, что хотите удалить этот файл? Да/Нет"... и Я ХОЧУ ИСПОЛЬЗОВАТЬ ИХ В МОЕМ Ajax.ActionLink!

Поскольку я не нашел ответа в сети, я искал простой способ сделать это... и теперь публикую его здесь.

Во-первых: прочитайте и внедрите на своей странице хороший учебник, написанный Рикардо Ково: «Подтверждение удаления ASP MVC с помощью диалогового окна пользовательского интерфейса Ajax и jQuery» (просто погуглите)

Я внес простые изменения в его код Javascript, просто используя remove() вместо hide('fast') и применив класс item к tr для удаления.

deleteLinkObj.closest("tr").hide('fast')

становится

deleteLinkObj.closest("tr.item").remove();

Теперь, после того как вы выполнили предыдущий урок, вы готовы заменить

<%: Html.ActionLink([LinkName],[ActionName], new { id = item.Id }, new { @class = "delete-link" })%>

ругаться с

<%:Ajax.ActionLink([LinkName],[ActionName],[ControllerName],new { id = item.Id },new AjaxOptions{HttpMethod = "Delete" /*You can use Post though*/,OnBegin = "JsonDeleteFile_OnBegin" /*This is the main point!*/}, new { @class = "delete-link" } ) %>

Вы можете использовать метод Post, если хотите, здесь важна опция OnBegin, которая вызывает javascript, который предотвращает вызов действия сервера до подтверждения диалога JQueryUI:

<script language="javascript">function JsonDeleteFile_OnBegin(context) {return false;/*Prevent the Ajax.Action to fire before needed*/}</script>

Разместите javascript на странице.

Итак, что теперь произойдет: когда вы нажмете кнопку «Удалить», откроется JQueryUI при вызове функции OnBegin (которая отменяет обычное действие публикации). В случае «Подтверждения» код Рикардо Ково запустит действие на стороне сервера, а в javascript-коде подтверждения Рикардо Ково вы сможете выполнить все действия в случае успеха (например, скрыть удаление строки).

Обратите внимание: с помощью этого метода вы должны управлять функцией для успеха/неудачи в коде javascript Рикардо Ково, так как OnSuccess и OnComplete AjaxOptions вообще не будут запущены (вероятно, перезаписаны каким-то кодом).

person fgpx78    schedule 16.11.2010
comment
Почему -1? Я думаю, что это полезный ответ, и сегодня он работает для меня как шарм (также после перехода на MVC3). - person fgpx78; 28.04.2011