jQuery.Ajax VS Ajax.beginform與非侵入式JavaScript

第一次發帖，請溫柔:)jQuery.Ajax VS Ajax.beginform與非侵入式JavaScript

我是比較新的MVC3和我建立工作web應用程序。

我有幾個頁面的CheckBoxes打開/關閉功能，當他們改變我通過jQuery Ajax調用提交併返回一個json成功/失敗給我，所以我可以顯示一條消息。

我有一些表單，我只是提交一堆字段（不是用Ajax），並檢查模型狀態是否有效等。如果不是，則用消息重新顯示錶單。我想用Ajax來代替。

我有一個使用Ajax.BeginForm的表單，它向控制器正確提交，模型已驗證，如果有錯誤，我返回一個使用UpdateTargetId替換的部分視圖。

我想要做的事情是......如果模型是有效的並且保存成功，我需要返回一個局部視圖，因爲無論如何UpdateTargetId都會替換我的表單。我想發回一個某種「成功」的標誌，這樣我就可以顯示一條消息，說'你的數據已經保存'了。

如果Ajax調用成功，OnSuccess觸發，並且不關心模型是否有效。

我可以使用jQuery.Ajax提交表單並在控制器中返回PartialView的返回以及成功或失敗，我認爲？

任何人都可以告訴構建「Ajax」Web應用程序時的最佳實踐嗎？

來源

2012-10-05 mike

您可以使用普通的javascript而不是使用Ajax.Beginform輔助方法來處理此問題。

@model ProductViewModel 
<div id="divForm"> 
@using(Html.Beginform()) 
{ 
    @Html.TextBoxFor(x=>x.Name) 
    @Html.TextBoxFor(x=>x.Location) 
    <input type="submit" id="btnSave" /> 
} 
</div> 
<div id="divItem" /> 
<script type="text/javascript"> 
    $(function(){ 
    $("#btnSave").click(function(e){ 
     e.preventDefault(); // prevent the default form submit 

     var form=$(this).closest("form"); 
     $.post(form.attr("action"),form.serialize(),function(result){ 
      if(result.Status=="success") 
      { 
       //show message and load the new partial view if needed. 
       $(#divForm").hide(); 
       $("#divItem").html(reuslt.ViewHTML); 
      } 
      else 
      { 
       alert("Error"); 
      } 
     }); 
    }); 
    }); 
</script>

假設你有接受我們的形式subimt並返回JSON數據返回的HttpPost操作方法。

[HttpPost] 
public ActionResult Edit(ProductViewModel model) 
{ 
    // here you may validate the model and save if needed and return JSON back. 
    //to do : return JSON 
}

響應JSON應採用以下格式。

{ "Status" : "success", "ViewHTML" : "<p>This is some markup</p>" }

This answer解釋瞭如何在JSON響應中返回ViewResult。

來源

2012-10-05 18:28:29 Shyju

感謝您的回覆。當我在等待時，我發現這個答案有一個類似的方法從PartialView中檢索HTML。 http://stackoverflow.com/a/4692447/1720705 這是使用Ajax保存記錄並根據具體情況顯示驗證錯誤或成功消息的最佳做法嗎？我寧願學習普遍接受的最佳實踐，也不願意做錯事，之後不得不改變自己的方式。 – mike

jQuery.Ajax VS Ajax.beginform與非侵入式JavaScript

回答

相關問題