迷失：在ASP.NET MVC3 / jQuery中通過Ajax獲取完全渲染的視圖

Question

所有，

我對MVC3 / jQuery組合非常陌生，並且一直在閱讀教程。 雖然我了解了概念，剃刀語法等，但對於如何實現我要嘗試的基本概念還是有些困惑。

我有一個textarea，當有人在其中輸入一些文本並按下Enter鍵時，我想觸發一個帶有文本區域內容的服務器的Ajax調用，然后取回可以放在div中的完整HTML文本。 現在，正如我在MVC3中所了解的那樣，這將是一個視圖，因此在某種意義上，我正在服務器上渲染視圖並將其發送回去，以便可以將其放入HTML中。

這可能嗎？ 我可以查找任何示例來了解如何完成此操作嗎？ 我知道如何捕獲擊鍵，獲取值等，這是我努力理解的通過ajax完全形成HTML的部分呈現。

謝謝，

Answer 1

您可以使用jQuery。 這就是它的工作方式。 您偵聽文本區域的keydown事件，當有keydown時，檢查它是什么鍵。如果是enter鍵，則對服務器頁面進行jQuery ajax post調用（控制器中的操作方法包含數據）將數據保存到表中，並返回所需的標記並返回。 在腳本中將其加載到相關的div。

的HTML

//Load jQuery library in your page

<textarea id="txtComment" > </textarea>
<div id="divComment"></div>

Java腳本

$(function(){

 $("#txtComment").keydown(function (event) {

     if (event.keyCode == 10 || event.keyCode == 13) {

         var comment=$("#txtComment").val();
         comment=encodeURIComponent(comment);
         $.post("yourcontroller/actionmethod?data="+comment,function(response){
         $("#divComment").html(response);
       });

    }

 });    

});

和你的控制器動作方法

public ActionResult actionmethod(string data)
{
  //Do some sanitization on the data before saving.

  // Call your method to save the data to your tables.

   CommentViewModel objCommentVM=new CommentViewModel();
   objCommentVM.Comment=data;

  return View("PartialCommentView",objCommentVM);

}

您應該有一個名為“ CommentViewModel”的ViewMolde類，例如

public class CommentViewModel
{
   public string Comment{ set; get; }
}

並且您應該有一個名為PartialCommentView的視圖，該視圖的類型嚴格於CommentViewModel

@model FlashRack.ViewModel.RackViewModel
@{
    Layout = null;
}
<div>
 @Model.Comment
</div>

如果您只是返回一個字符串，而不是返回一個View，則也可以使用Return Content("your string here")方法簡單地返回該字符串。 但是我更喜歡通過View返回ViewModel，因為它對我來說是更可擴展和更簡潔的方法。

您的操作方法將返回您在PartialCommentView中具有的標記以及數據。

請記住，您必須照顧好特殊字符並正確轉義它們。