Unikanie zduplikowanego przesyłania formularzy w Asp.net MVC przez dwukrotne kliknięcie przesłać

Question

Renderuję formularz w Asp.net MVC za pomocą przycisku przesyłania. Strona przekierowuje po pomyślnym dodaniu rekordu do bazy danych. Poniżej znajduje się kod: -

[HttpPost] 
public ActionResult Create(BrandPicView brandPic) 
{ 
    if (ModelState.IsValid) 
    { 
     if (!String.IsNullOrEmpty(brandPic.Picture.PictureUrl)) 
     { 
      Picture picture = new Picture(); 
      picture.PictureUrl = brandPic.Picture.PictureUrl; 
      db.Pictures.Add(picture); 
      brandPic.Brand.PictureId = picture.Id; 
     } 
     db.Brands.Add(brandPic.Brand); 
     db.SaveChanges(); 
     return RedirectToAction("Index"); 
    } 
    return View(); 
} 

Ale podczas testów, widziałem, że jeśli formularz jest znowu i znowu kliknięciu wielokrotne wpisy są przekazywane i zapisywane w bazie danych.

W jaki sposób mogę się upewnić, że jeśli formularz został przesłany jeden raz na serwer, nie zostaną przesłane żadne duplikaty.

Answer 1

Nie sądzę, że jest to dość duplikat odpowiedzi, do której odnosi się komentarz, ponieważ link dotyczy wiosennego MVC, a to pytanie dotyczy .NET MVC.

Właściwie to spędziłem kilka godzin, a potem wymyśliłem następujące. Ten javascript ładnie się haczy z dyskretną walidacją jquery i można go zastosować do dowolnej formy, która ma <input type="submit". Zauważ, że wykorzystuje funkcję jQuery on 1,7 za: Potrzebne są

$(document).on('invalid-form.validate', 'form', function() { 
    var button = $(this).find('input[type="submit"]'); 
    setTimeout(function() { 
     button.removeAttr('disabled'); 
    }, 1); 
}); 
$(document).on('submit', 'form', function() { 
    var button = $(this).find('input[type="submit"]'); 
    setTimeout(function() { 
     button.attr('disabled', 'disabled'); 
    }, 0); 
}); 

W setTimeouts. W przeciwnym razie może się zdarzyć, że przycisk zostanie wyłączony po kliknięciu, nawet po niepowodzeniu sprawdzania poprawności po stronie klienta. Mamy to w globalnym pliku javascript, dzięki czemu jest on automatycznie stosowany do wszystkich naszych formularzy.

Answer 2

Wyłącz przycisk "Wyślij". Można to zrobić za pomocą JQuery/Java Script.

Zobacz, jak to zrobić: this example.

Answer 3

Wyłączenie przycisku jest w porządku za pomocą JavaScript, ale co jeśli użytkownik go wyłączył lub pomija go? Jeśli korzystasz z zabezpieczeń po stronie klienta, wykonaj kopię zapasową po stronie serwera. Chciałbym użyć tutaj PRG pattern.

Answer 4

Można używać Ajax.BeginForm insted html.BeginForm aby to osiągnąć, jeśli używasz OnSuccess insted OnBegin można mieć pewność, że metoda wykonać udany, a potem swoją kolej, aby wyłączyć przycisk, z ajax pobyt w bieżący widok i można wykonać aktualizację widoku zamiast przekierowania

@using (Ajax.BeginForm(
new AjaxOptions 
{ 
    HttpMethod = "post", 
    InsertionMode = InsertionMode.Replace, 
    UpdateTargetId = "dive", 
    OnBegin="deactive" 
})) 
{ 
//body of your form same as Html.BeginForm 
<input type="submit" id="Submit" value="Submit" /> 
} 

i używać tego jQuery w formularzu:

<script type="text/javascript" language="javascript"> function deactive() { $("#Submit").attr("disabled", true); }</script> 

uważać za korzystanie ajax masz do c Wszystko to taistry w końcu swojej stronie

<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>