JQueryとAjax.BeginForm（）は同じデータを2回転記します

Question

オクラホン私はウェブの初心者ですが、今は完全に夢中です。ここに私の問題があります：

私は、MVCContribグリッドとJQueryダイアログでラップされたAjaxフォームを表示する "Add Accounts"リンクを持つページを持っています。私がワークフローを終えると、すべてがうまくいっています。私は新しい項目を追加し、JQuery/Ajaxを介してグリッドをすべてリフレッシュすることができます（私はそう思います）。しかし、2回目にフォームを追加しようとすると、最初のフォームのデータが常に送信されます。私はあまりにも長い間問題を見てきましたが、私は完全に立ち往生していることを認めなければなりません。 Btw - 私はこれを完全に間違ってやっていると確信していますので、何か良いことを提案してください。ここで

は、フォームの：

@using (Ajax.BeginForm("SaveCheckAccount", "UserManagement", null, new AjaxOptions { OnSuccess = "onAccountAdded", OnFailure = "onAccountAddedFailed"}, new { id = "accountDetails" })) 
{ 
    @Html.ValidationSummary(true) 
    @Html.HiddenFor(model => model.Id) 
    @Html.HiddenFor(model => model.version) 
    @Html.HiddenFor(model => model.User_Id) 
    @Html.HiddenFor(model => model.IsDefault)   
    <table> 
     <tr> 
      <td> 
       Account Number 
      </td> 
      <td> 
       @Html.TextBoxFor(model => model.AccountNumber) 
       @Html.ValidationMessageFor(model => model.AccountNumber, "*") 
      </td> 
     </tr> 
     <tr> 
      <td> 
       Routing Number 
      </td> 
      <td> 
       @Html.TextBoxFor(model => model.RoutingNumber) 
       @Html.ValidationMessageFor(model => model.RoutingNumber, "*") 
      </td> 
     </tr> 
     <tr> 
      <td> 
       Account Type 
      </td> 
      <td> 
       @Html.DropDownListFor(model => model.AccountType_Id, new SelectList(@accountTypes, "ID", "Name", Model.AccountType_Id)) 
       @Html.ValidationMessageFor(model => model.CheckAccountType) 
       @Html.ValidationMessageFor(model => model.AccountType_Id, "*") 
      </td> 
     </tr> 
     <tr> 
      <td> 
       Bank Name 
      </td> 
      <td> 
       @Html.TextBoxFor(model => model.BankName) 
       @Html.ValidationMessageFor(model => model.BankName, "*") 
      </td> 
     </tr> 
     <tr> 
      <td> 
       Account Name 
      </td> 
      <td> 
       @Html.TextBoxFor(model => model.AccountName) 
       @Html.ValidationMessageFor(model => model.AccountName, "*") 
      </td> 
     </tr> 
    </table> 
} 

<script type="text/javascript"> 
    $.ajaxSetup({ cache: false }); 
</script> 

このJavaScriptはbank.jsに常駐intiallyこのビューに追加リンクをクリックすることでレンダリングされるためにザ・

function BindCommands(createUrl) { 

     $("#modalAdd").live("click", function (e) { 
      var dialogBox = $("<div>"); 
      e.preventDefault(); 
      $(dialogBox).dialog({ 
       autoOpen: false, 
       resizable: false, 
       title: 'Create Account', 
       modal: true, 
       show: { effect: "blind", duration: 50 }, 
       hide: { effect: "blind", duration: 50 }, 
       open: function (event, ui) { 
        $.ajax(
         { 
          type: "Get",       
          url: createUrl, 
          success: function (result) { 
           $(dialogBox).html(result); 
          } 
         }); 
       }, 

       buttons: { 
        Save: function() { 
         $("#accountDetails").submit(); 
         $(this).dialog('close');      
        }, 
        Cancel: function() { 
         $(this).dialog("close"); 
        } 
       } 
      }); 
      $(dialogBox).dialog('open'); 
     }); 
    } 

    function onAccountAdded(data, status, xhr) {  
     $("#accounts-grid").html(data); 
    }; 

    function onAccountAddedFailed(data, status, xhr) { 
     alert("Failed");  
    }; 

ファイル：

<script type="text/javascript"> 
    $.ajaxSetup({cache:false}); 
    $(document).ready(function() { 
     var createUrl = '@Url.Action("NewBankAccountDetails", "UserManagement", new {userId=@Model.Id})'; 
     BindCommands(createUrl); 
    }); 

</script>  
@if (Model != null && Model.Id > 0) 
{ 

    <tr> 
     <td class="header" colspan="2"> 
      User Accounts 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <a href="#" id="modalAdd">Add Account</a> 
     </td> 
    </tr> 

    Html.RenderPartial("_BankAccountGrid", Model.CheckAccounts); 
} 

Answer 1

私は次のスクリプトが含まれていることに気づくまで、私は同じ問題を抱えており、私の頭を壁に叩いた二回uded：

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

私はそれが私のスクリプトバンドル内に設定し、ビューテンプレートはまた、Ajaxフォームで、二重投稿の中で結果を含めていました。

はそれがバウンティ:-P