MVC 5 Html.BeginForm с использованием JQuery ajaxForm с данными и загрузкой файлов возвращает новую страницу. Когда следует заменить

Я хочу опубликовать Html.BeginForm с данными и файлом и заменить содержимое новыми данными. Я сделал это только с данными.

JQuery с успехом, но только с данными.

 $('form').submit(function () {
    if ($(this).valid()) {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function (result) {
                // Element is a div.
                $(element).html(result);
            }
        });
    }
    return false;
});

Я пробовал уже 8 часов и придумал это. Но он перенаправляет меня на новую страницу, когда он должен обновить div. Все остальное работает как надо. Как загрузить файл и данные. Меня просто перенаправляет на новую страницу. И я схожу с ума.

Я использую ненавязчивый и validate.min. Я могу проверить форму и заставить ее обновить «БЕЗ ЗАГРУЗКИ ФАЙЛА».

Мой подход через 8 часов...

Частичное представление

@using Website.Models
@model MySuperModel
@if (Model != null)
{      
    using (Html.BeginForm("Action", "Controller", null, FormMethod.Post, new { enctype = "multipart/form-data", id = "helpme", @class = "please" }))
    {
        @Html.AntiForgeryToken()
        // Some code..
    }
}

Контроллер

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Action(MySuperModel Model, HttpPostedFileBase file)
{           
        // Some file validation

        if (ModelState.IsValid)
        {
            // Updating the database and sets Model to its new values.                    
        }

    return PartialView("Action", Model);
}

Также пытался

return View(Model);
return ParticalView(Model);
return ParticalView("~/Views/SecretService/Action.cshtml", Model);

JQuery

$('form').submit(function () {
    if ($(this).valid()) {
        $(this).ajaxForm({
            beforeSend: function () {
                // Doing some loading gif stuff
            },
            success: function (result) {
                // element is div holding the ParticalView
                $(element).html(result);
            },
            complete: function () {
                $.validator.unobtrusive.parse('form');
                // And so on.
            }
        });

    }
    return false;
});

Я немного сократил код, чтобы сделать его более читаемым. Я надеюсь, что кто-то может помочь.


person The Almighty Bobo    schedule 22.08.2015    source источник
comment
Если вы хотите отправить файлы for и с помощью ajax, обратитесь к этот ответ   -  person    schedule 23.08.2015
comment
Спасибо за ответ. можно ли это сделать с помощью Html.BeginForm()?   -  person The Almighty Bobo    schedule 23.08.2015
comment
Конечно, но вам действительно не нужно Html.BeginForm(), если вы публикуете форму с помощью ajax. Если вы хотите сделать нормальную отправку формы, вам просто нужно добавить в форму атрибут enctype="multipart/form-data" (и удалить свой скрипт)   -  person    schedule 23.08.2015
comment
@Stephen Muecke - Когда я удалил Html.BeginForm и написал простой html, это сработало. разместить ответ, и я приму. а затем я отправлю то, что я сделал для будущих ссылок.   -  person The Almighty Bobo    schedule 23.08.2015


Ответы (2)


Благодаря @Stephen Muecke я заставил его работать.

Для будущих ссылок.

Просмотреть

-Replace-
using (Html.BeginForm("Action", "Controller", null, FormMethod.Post, new { enctype = "multipart/form-data", id = "helpme", @class = "please" }))
-With-
<form action="@Url.Action("Action", "Controller")" id="helpme" enctype="multipart/form-data" class="please" method="post">

JQuery

$('form').submit(function (event) {

    /*
        First it dinnt work until i prevented the server side form submit.
        So this may actual work with @Html.BeginForm()
        But i dinnt have the energy to try it, since i got it to work.
    */
    event.preventDefault();

    if ($(this).valid())
    {
        var formdata = new FormData($(this).get(0));

        $.ajax({
            url: this.action,
            type: this.method,
            data: formdata,
            processData: false,
            contentType: false,
            beforeSend: function () {
                // Doing some loading gif stuff
            },
            success: function (result) {
                // element is div holding the ParticalView
                $(element).html(result);
            },
            complete: function () {
                $.validator.unobtrusive.parse('form');
                // And so on.
            }
        });
    }
    return false;
});

Теперь это работает.

person The Almighty Bobo    schedule 23.08.2015

Привет, вы должны использовать JsonResult вместо ActionResult для вызовов ajax. ActionResult всегда будет приводить к обновлению страницы.

[HttpPost]
[ValidateAntiForgeryToken]
public JsonResult Action(MySuperModel Model, HttpPostedFileBase file)
{           
        // Some file validation

        if (ModelState.IsValid)
        {
            // Updating the database and sets Model to its new values.                    
        }

    return (result.ToHtmlString(), JsonRequestBehavior.AllowGet)
}
person funkyCatz    schedule 22.08.2015
comment
Бред какой то. JsonResult это ActionResult ! И OP вызывает метод, используя вызов ajax, поэтому он НИКОГДА не приведет к обновлению страницы. И что такое result.ToHtmlString() - ваш код просто вызовет исключение! - person ; 23.08.2015
comment
Прежде всего. Спасибо за ответ и попытку помочь мне. Но я не могу понять ваш .ToHtmlString(). Но я попытался изменить его на JsonResult, вернуть строку JSON и заменить div только этим. Но он все равно перенаправляет меня на новую страницу. - person The Almighty Bobo; 23.08.2015