MVC Razor從javascript的視圖中獲取控制器的值

Question

我必須從視圖中的控制器方法獲取值才能寫入某些javascript。在網頁中，它就像<％= functionName（）％>一樣簡單。有沒有辦法在MVC中做到這一點。我無法使用模型，因爲JavaScript必須在頁面加載時可用。任何見解都會被讚賞

Answer 1

有沒有辦法做到這一點在MVC

是的，當然。

我無法使用模型，因爲JavaScript必須在頁面加載時可用。

當然，你可以使用視圖模型，沒有什麼會阻止你這樣做。所以，你首先來定義它：

public class MyViewModel 
{ 
    public string Foo { get; set; } 
} 

然後有一個控制器操作將填充這個視圖模型，並通過它的觀點：

public ActionResult Index() 
{ 
    var model = new MyViewModel(); 
    model.Foo = "Hello World"; 
    return View(model); 
} 

終於在一個強類型的視圖這個視圖模型其中：

@model MyViewModel 
<script type="text/javascript"> 
    $(function() { 
     var foo = @Html.Raw(Json.Encode(Model.Foo)); 
     alert(foo); 
    }); 
</script> 

但是，現在讓我們假設你不想污染與JavaScript您的看法，但有它在一個單獨的js文件，而不是（這當然是正確的做法）。

你可以在某處你的DOM使用HTML5 data-*屬性嵌入值，例如：

<div id="foo" data-model="@Html.Raw(Html.AttributeEncode(Json.Encode(Model)))"> 
    Click me to surprise you 
</div> 

，然後在一個單獨的JavaScript訂閱這個元素的click事件和讀取data-*屬性中，我們讓JSON序列化整個視圖模型：

$(function() { 
    $('#foo').click(function() { 
     var model = $(this).data('model'); 
     alert(model.Foo); 
    }); 
});