MVC 4 Ajax-форма сообщения всегда публикует со значениями, опубликованными с первым попыткой
Я пытаюсь создать простое приложение CRUD. У меня есть частичное представление, которое заполняет строки. В каждой строке есть ссылка "Изменить", по щелчку которой я открываю диалог jquery. В этом диалоговом окне я загружаю другой частичный вид для редактирования соответствующей строки. На кнопку ОК я отправляю форму (которая является формой Ajax).
Затем контроллер возвращает другое частичное представление, которое предполагается заменить исходным списком (частичное представление списка), потому что я предоставляю updateTargetId (это div, в котором отображается список.
Здесь я сталкиваюсь с двумя проблемами,
- Это работает впервые (т.е. впервые в сеансе), я публикую форму. Когда я открываю другую запись для редактирования, форма загружается правильно, но когда я публикую ее, форма всегда содержит значения записи, которые публикуются с первой попытки.
- Список не обновляется даже после успешной публикации. Я вижу ответ на пост в Fiddler. Список обновляется только после обновления браузера.
Я попытался очистить modelState, но не работает. Я попытался отладить код jquery и обнаружил, что когда я делаю form.serialize имеет старые значения, поэтому контроллер всегда получает эти значения.
Я думаю где-то это кеширование формы. Затем я отключил кеширование, добавив
$.ajaxSetup({ cache: 'false' });
в документе. уже. Это также не работает.
Вот код JQuery
this.bindOpenDialog = function () {
$(".openDialog").click(function (e) {
e.preventDefault();
var height = $(this).attr("data-dialog-height");
var width = $(this).attr("data-dialog-width");
var data_postUrl = $(this).attr("data-postUrl");
var data_returnUrl = $(this).attr("data-returnUrl");
var data_updateTarget = $(this).attr("data-updateTarget");
var data_form_id = $(this).attr("data-form-id");
var callBack = $(this).attr("callBack");
if (data_postUrl == '') {
data_postUrl = this.href;
}
var div = $("<div></div>");
div.addClass("ui-dialog")
div.attr("id", $(this).attr("data-dialog-id"))
var dialog = div.dialog({
title: $(this).attr("data-dialog-title"),
close: function () { $(this).remove() },
height: height,
width: width,
modal: true,
buttons: {
'Save': function () {
var dialog = $(this);
var form = null;
if (data_form_id == '' || data_form_id == undefined) {
form = dialog.find('form').first();
}
else {
form = $("#" + data_form_id).first();
}
var req = $.post(data_postUrl, form.serialize(),
function (responseText, textStatus) {
}, "html");
req.success(function (data) {
if (callBack == '' || callBack == undefined) {
dialog.dialog('destroy');
}
else {
var cb = eval(callBack + "()");
dialog.dialog('destroy');
}
});
req.success(function (data) {
if (callBack == '' || callBack == undefined) {
thisDialog.dialog('destroy');
}
else {
var cb = eval(callBack + "()");
thisDialog.dialog('destroy');
}
//remove the form from the DOM.
//If I do not do this, it always posts the
// form which was posted for the first time.
$("#" + data_form_id).remove();
});
req.error(function (e) {
alert('error ' + e.toString())
});
},
'Cancel': function () {
var dialog = $(this);
dialog.dialog('destroy');
}
}
});
dialog.load(this.href);
}
);
кто-нибудь уже сталкивался с этой проблемой?
Еще одно мое замечание заключается в том, что jQuery не обновляет цель. Я также установил событие OnSuccess в форме Ajax, которая не запускается.
Еще одно мое замечание заключается в том, что jQuery не обновляет цель. Я также установил событие OnSuccess в форме Ajax, которая не запускается.
3 ответа
Я не уверен, что это лучший способ сделать это, но когда я удаляю форму из DOM после того, как уничтожаю диалог в javascript. Я думаю, что JQuery не убивает экземпляр формы
Теперь мой JavaScript выглядит так
req.success(
function (data) {
if (callBack == '' || callBack == undefined) {
thisDialog.dialog('destroy');
}
else {
var cb = eval(callBack + "()");
thisDialog.dialog('destroy');
}
//remove the form from the DOM.
//If I do not do this, it always posts the form which was posted for the first time.
$("#" + data_form_id).remove();
}
);
Кто-нибудь может посоветовать, если есть какой-то лучший подход?
С уважением, Махеш
Метод Mark, который возвращает частичные представления (для редактирования и для списка) для редактирования с помощью атрибута и перестройки решения:
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]
Хорошо, одна информация, которую я хотел бы поделиться, я использую Ajax.BeginForm. Я открываю эту форму в диалоге jquery. Этот диалог имеет кнопки OK и Отмена. На Ok нажмите, я отправляю свою форму ajax. Вот почему он не обновляет div. Я опубликую эту форму, используя кнопку Отправить, она работает.
Таким образом, обучение заключается в том, что если вы используете форму Ajax.Begin, то вам необходимо опубликовать форму с помощью кнопки отправки, чтобы обновить цель и запустить сценарий для события OnComplete.
Если вы отправите форму, используя любую другую кнопку, вы не сможете воспользоваться этим преимуществом. В этом случае вам нужно сделать это с помощью JavaScript.
Надеюсь, это кому-нибудь поможет.
(Я отмечаю это как ответ, чтобы привлечь внимание к этому сообщению.)