jQuery, MVC3: отправка формы частичного просмотра в модальном диалоговом окне

Попробуйте что-нибудь из строк:

open: function (event, ui) {
    $(this).load("PartialEdit/" + id.toString(), function(html) {
        $('form', html).submit(function() {
            $.ajax({
                url: this.action,
                type: this.method,
                data: $(this).serialize(),
                success: function(res) {
                    if (res.success) {
                        $(dialogBox).dialog('close');
                    }
                }
            });
            return false;
        });
    });
}

и действие контроллера может вернуть JSON:

[HttpPost]
public ActionResult PartialEdit(int id, FormCollection collection)
{ 
    // do some processing ...

    // obviously you could also return false and some error message
    // so that on the client side you could act accordingly
    return Json(new { success = true });
}

Заключительная часть для улучшения заключается в следующем:

"PartialEdit/" + id.toString()

Никогда не делайте такое жесткое кодирование URL-адресов в приложении ASP.NET MVC. Всегда используйте помощники по URL-адресам при работе с URL-адресами. Поэтому сделайте свой якорь немного более динамичным и вместо:

<a href="#" class="trigger" rel="1">Open</a>

использовать:

@Html.ActionLink(
    "Open", 
    "PartialEdit", 
    new {
        id = "1" // you probably don't need a rel attribute
    }, 
    new { 
        @class = "trigger"
    }
)

а потом:

$(this).load(this.href, function(html) {
    ...
    return false; // now that the anchor has a href don't forget this
});

Спасибо за ваш вклад, решение, которое работает для меня на данный момент, заключается в том, что эта функция прикреплена к кнопке «Отправить» в диалоговом окне....

"Submit": function () {
    var $this = this;
    var form = $('form', $this);
    if (!$(form).valid()) {
       return false;
    }

    $.post(form.attr("action"), JSON.stringify($(form).serializeObject()), function () {
        $($this).dialog("close").dialog("distroy").remove();
    });
}

... что представляет собой комбинацию ответов выше.

Еще раз спасибо.

Кнопка в порядке при частичном представлении, но похоже, что вы хотите отправить форму через AJAX, чтобы страница не обновлялась. Вы можете сделать это следующим образом:

$('#theIdOfYourForm').live('submit', function(event){
    event.preventDefault();
    var form = $(this);
    $.post(form.attr('action'), form.serialize(), function(data){
        if (data.IsError) { alert(data.Error); }
        else { alert(data.Message); }
    });
});

И верните объект JSON из действия HttpPost PartialEdit, который определяет IsError, Error или Message по мере необходимости. Вы можете увлечься этим, но тогда этот ответ будет слишком длинным :)

Что ж, отправка jQuery ничего не делает, вам нужно иметь форму внутри частичного представления, тогда что происходит, когда выполняется отправка диалогового окна jQuery, вы вызываете отправку формы, для которой уже определено действие.

Смотрите мой код ниже, который не является отправкой ajax

      }); 
    $dialog
        .dialog("option", "buttons", {
            "Submit":function(){
                var dlg = $(this);
                var $frm = $(frm);
                if(onFormSubmitting != null)
                    onFormSubmitting();
                $frm.submit();
        },
        "Cancel": function() { 
            $(this).dialog("close");
            $(this).empty();
        }    

    });

И что касается нашего вопроса внутри почтового действия, вы должны выполнить свою бизнес-логику, а затем вызвать «Return RedirectToAction («viewname», new {id = xxx})»

Сегодня я столкнулся с аналогичной проблемой, когда мне пришлось отправить форму, которая была в частичном представлении, а частичное представление было в диалоговом окне, которое было создано из другой формы!

Суть заключалась в том, чтобы получить обработчик формы в частичном представлении и сериализовать его.

Вот как я определил свой диалог в первой форме:

var udialog = $('#userdialog').dialog({
            open: function(event, ui) {                    
                $(this).load('xx');
            },
            buttons: {
                "Submit" : function(){                         
                    $.ajax(
                         {
                             url: 'xx',
                             type: "POST",
                             async: true,
                             data: $('form', $(this)).serialize()
                    });
                }
             }                 
        });