ASP.NET MVC Форма загружается через AJAX отправляется несколько раз

Question

У меня есть частичное представление, содержащее форму ajax. Это частичное представление загружается на мою страницу с помощью вызова ajax. Я могу редактировать поля и отправить форму, и все работает нормально. Однако, если я перезагрузлю форму N раз, форма будет отправлена ​​N раз при нажатии кнопки сохранения.

вот код для частичного просмотра ....

@model blah blah...

<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")"type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript</script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"type="text/javascript"></script>

<div id="modalForm">
  @using (Ajax.BeginForm("Edit", "Info", new{id = Model.UserId}, AjaxOptions{OnSuccess = "infoUpdate" }))
  {


       //FORM FIELDS GO HERE

      <input type="submit" value="Save" />


  }
</div>

Что я делаю не так, что вызывает такое поведение?

Answer 1

Каждый раз, когда вы перезагружаете форму, появляется триггер для отправки формы.Таким образом, у вас есть n отправка, если вы перезагрузите форму n раз.

Попробуйте загрузить форму только один раз, если это возможно.

Вы можете попытаться отменить привязку триггера отправки, нажавна кнопку отправки:

<input type="submit" value="Save" onClick="submitForm()" />

var submitForm = function() {
    $("#formAddressShipping form").trigger('submit');    
    $("#formAddressShipping form").unbind('submit');
    return false;
};

Answer 2

Перемещение этого jquery.unobtrusive-ajax.js за пределы частичной решило проблему в моем случае.

Answer 3

Просто если кто-то все еще ищет это - проблема может возникнуть, если у вас есть несколько ссылок на jquery.unobstrusive js. Для меня это было в макете и частично. Форма была отправлена ​​4 раза, может быть количество полей. Удаление JS из частично исправлено. Благодаря этой теме ASP.NET AJAX.BeginForm отправляет несколько запросов

Answer 4

Я столкнулся с той же проблемой и решил ее следующим образом. У меня есть список. Из этого списка я вызываю New, Update, Delete формы в диалоге пользовательского интерфейса. Успешное закрытие диалогового окна и возврат к списку и обновлению пользовательского интерфейса. Ошибка покажет сообщение проверки и диалог останется прежним. Причина в том, что AjaxForm публикует сообщения несколько раз при каждом нажатии.

Решение:

//Link click from the list -

$(document).ready(function () {
            $("#lnkNewUser").live("click", function (e) {
                e.preventDefault();
                $('#dialog').empty();
                $('#dialog').dialog({
                    modal: true,
                    resizable: false,
                    height: 600,
                    width: 800,
                }).load(this.href, function () {
                    $('#dialog').dialog('open');
                });
            });

//Form submit -
$('#frmNewUser').live('submit', function (e) {
            e.preventDefault();
            $.ajax({
                url: this.action,
                    type: this.method,
                    data: $('#frmNewUser').serialize(),
                    success: function (result) 
                    {
                        debugger;
                        if (result == 'success') {
                            $('#dialog').dialog('close');
                            $('#dialog').empty();
                            document.location.assign('@Url.Action("Index", "MyList")');
                        }
                        else {
                            $('#dialog').html(result);
                        }
                    }
                });

        return false;
    });

Сценарии должны быть в интерфейсе списка. Не в частичных представлениях (новый, обновление, удаление)

//Partial View -

@model User

@Scripts.Render("~/bundles/jqueryval")

@using (Html.BeginForm("Create", "Test1", FormMethod.Post, new { id = "frmNewUser", @class = "form-horizontal" }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    @Html.HiddenFor(model => model.UserID)
<p>@Html.ValidationMessage("errorMsg")</p>
...

}

//Do not use Ajax.BeginForm

//Controller -

    [HttpPost]
    public ActionResult Create(User user)
    {
        if (ModelState.IsValid)
        {
            try
            {
                user.CreatedDate = DateTime.Now;
                user.CreatedBy = User.Identity.Name;

                string result = new UserRepository().CreateUser(user);
                if (result != "")
                {
                    throw new Exception(result);
                }

                return Content("succes");
            }
            catch (Exception ex)
            {
                 ModelState.AddModelError("errorMsg", ex.Message);
            }
        }
        else
        {
            ModelState.AddModelError("errorMsg", "Validation errors");
        }
        return PartialView("_Create", user);
    }

Надеюсь, кто-то получит помощь от этого. Спасибо всем за вклад. Кредит http://forums.asp.net/t/1649162.aspx

Answer 5

Мой первый пост, столкнулся с той же проблемой

вот решение, которое работало для меня ..

@using (Html.BeginForm("", "", FormMethod.Post, new { enctype = "multipart/form-data", id = "MyForm" }))
{
    //form fields here..
    //don't add a button of type 'submit', just plain 'button' 
    <button type="button" class="btn btn-warning" id="btnSave" onClick="submitForm()">Save</button>  

    <script type="text/javascript">
        var submitForm = function () {
            if ($("#"MyForm").valid())
            { 
                //pass the data annotation validations...                  
                //call the controller action passing the form data..
                handleSaveEvent($("#MyForm").serialize());
            } 
            return false;
        };
    <script>
}

Answer 6

Переместите сценарии jQuery в DIV.Это, похоже, решило проблему.

Компромисс в том, что каждый пост будет получать каждый скрипт.