2011-02-02 34 views
5

Tôi có một khung nhìn một phần chứa biểu mẫu ajax. Chế độ xem một phần này được tải lên trang của tôi qua cuộc gọi ajax. Tôi có thể chỉnh sửa các trường và gửi biểu mẫu và mọi thứ hoạt động bình thường. Tuy nhiên, nếu tôi tải lại biểu mẫu N lần, biểu mẫu sẽ gửi N lần khi nhấn nút lưu.Mẫu ASP.NET MVC được tải qua ajax gửi nhiều lần

đây là mã cho xem một phầ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> 

Tôi đang làm gì sai đó gây ra hành vi này?

+0

Và câu hỏi là gì? –

+4

Umm Tôi nghĩ điều đó khá rõ ràng ... làm sao tôi có thể khắc phục được hành vi kỳ lạ này? – stephen776

+0

Bạn tải lại như thế nào? – jgauffin

Trả lời

3

Mỗi khi bạn tải lại biểu mẫu, trình kích hoạt sẽ được đặt để gửi biểu mẫu. Vì vậy, bạn có n trình, nếu bạn tải lại mẫu n lần.

Chỉ thử tải biểu mẫu một lần, nếu có thể.

Bạn có thể thử để unbind nộp kích hoạt, khi bạn click vào nút gửi của bạn:

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

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

Điều này có vẻ là nguyên nhân có khả năng nhất. Tôi sẽ cung cấp cho một thử và báo cáo lại – stephen776

+0

cũng không may mắn với phương pháp này. vẫn đăng lại nhiều lần ... – stephen776

+0

Đây là giải pháp cho vấn đề tương tự mà tôi gặp phải. Cảm ơn. – Mason240

0

Move các kịch bản jQuery bên trong DIV. Điều này dường như để khắc phục vấn đề.

Sự cân bằng là mỗi bài đăng sẽ thực hiện nhận cho mỗi tập lệnh.

1

Tôi đã gặp phải sự cố tương tự và giải quyết vấn đề như sau. Tôi có một danh sách. Từ danh sách đó, tôi gọi New, Update, Delete forms trong hộp thoại UI. Thành công sẽ đóng hộp thoại và sẽ trở lại danh sách và cập nhật giao diện người dùng. Lỗi sẽ hiển thị thông báo xác thực và hộp thoại sẽ vẫn giữ nguyên. Nguyên nhân là AjaxForm đang đăng lại nhiều lần trong mỗi lần gửi.

Giải pháp:

//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; 
    }); 

Các kịch bản phải ở trong Danh sách UI. Không ở chế độ xem một phần (Mới, Cập nhật, Xóa)

//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); 
    } 

Hy vọng ai đó sẽ được trợ giúp từ việc này. Cảm ơn tất cả vì những đóng góp. Tín dụng cho http://forums.asp.net/t/1649162.aspx

+0

Cảm ơn rất nhiều, tôi ước gì tôi đã tìm thấy điều này trước đó! Đã lãng phí một vài giờ cố gắng hiểu lý do tại sao biểu mẫu của tôi đã gửi nhiều lần và điều này hoạt động hoàn hảo. –

1

Chỉ cần một người nào đó vẫn đang tìm kiếm vấn đề này - sự cố cũng có thể xảy ra nếu bạn có jquery.unobstrusive js được tham chiếu nhiều lần. Đối với tôi, tôi đã có nó trong cách bố trí và một phần. Biểu mẫu đã được gửi 4 lần, có thể là số lượng trường. Loại bỏ các js từ một phần cố định nó. Nhờ chủ đề này ASP.NET AJAX.BeginForm sends multiple requests

2

Di chuyển số này jquery.unobtrusive-ajax.js ra ngoài giải quyết một phần vấn đề trong trường hợp của tôi.

0

bài đầu tiên của tôi, phải đối mặt với cùng một vấn đề

đây là giải pháp mà làm việc cho tôi ..

@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> 
} 
Các vấn đề liên quan