在MVC Asp.net中呈現部分視圖後，是否可以啓動javascript函數？

Question

讓我先介紹一下這個問題，因爲我對MVC很陌生。

我在那裏，我在一個局部視圖渲染的DevExpress網格中的實例。

@Html.Partial("MyGridPartial", Model) 

我需要在模型已經通過這個局部視圖渲染填充的時候啓動一個javascript函數。我試圖通過這個來做到這一點。 ：

settings.ClientSideEvents.EndCallback 

我可以達到這一點，但當時我沒有模型本身填充，所以它沒有任何好處。我想知道是否有人知道爲了跳入某些客戶端JavaScript代碼而踢出/附加到局部視圖渲染的通用方法。

Answer 1

如果您呈現這部分作爲視圖的正常流動的一部分被呈現，答案是否定的。

之所以這樣，是部分被轉換成字符串之前父視圖甚至呈現。那時，瀏覽器沒有看到你的標記，沒有讀過jscript。

如果，另一方面，您提供的部分在你的JQuery就緒功能：

$(document).ready(function() {

我認爲你需要（通過操作方法部分被調用）使用部分的動作。行動局部模板可以將您的JQuery就緒函數中通過引用URL（REST風格）被稱爲：

$('#divMyGridPartial').load('/Grids/MyGridPartial/{id}'); 

任何跟進的JScript/jQuery的功能，可以在準備好系列中被調用。

部分行動的其他優勢，型號是action方法中形成的，並且可以根據上下文到你所需要的（理想鉸斷傳遞一個id）創建的。

Answer 2

如果這是你在上serverthen Dave的方法，將工作最好的視圖渲染PartialView。只需將代碼連接到DOM就緒事件。

$(document).ready(function(){ 
    //Javascript logic to fire goes here 
}); 

，或者如果你prever簡寫版...

$(function(){ 
    //Javascript logic to fire goes here 
}); 

如果你渲染正在通過Ajax調用，那麼同樣的方法，將工作的局部視圖。如果我記得正確的話，jQuery將在通過Ajax傳遞迴客戶端的HTML中運行javascript（如果我正確記得，jQuery將在運行時將javascript傳遞給客戶端（請隨時測試此內容，我將通過內存關於一旦連接到DOM時觸發它，但我相信是load()方法的一個特性），假設你想運行的JavaScript是在響應中。如果它在發送Ajax請求的父頁面中，那麼最好的辦法就是將它連接到完整的事件。（我在這裏填充在客戶端的參數）

$("#wrapperAwaitingContent").load("/Grids/MyGridPartial", {id: null /*parameters*/}, function(text, status, xhr){ 
    //Javascript logic to fire goes here 
}); 

對我來說，在​​調用中使用的URL中使用的UrlHelper在服務器上

$("#wrapperAwaitingContent").load("@Url.Action("MyGridPartial", "Grids")", {id: null /*parameters*/}, function(text, status, xhr){ 
    //Javascript logic to fire goes here 
}); 

此外，還可以選擇解析使用Unobtrusive Ajax進行類似的操作。 （我填充參數在服務器端在這裏）

@Ajax.ActionLink("Load Data", "MyGridPartial", "Grids", new { id = null/*parameters*/ }, new AjaxOptions() { UpdateTargetId = "wrapperAwaitingContent", OnComplete="onCompleteMethodName" }) 

有它結束時，你可以比元素其他接收HTML並調用方法AjaxOptions設置更多的屬性，但我覺得我將重用在共享JavaScript文件中定義的函數，並且只有在它們尚未從此處填充時纔會填充它們，例如...

$("a[data-ajax='true']").each(function() { 
    var ajaxUpdate = $(this).closest("data-ajax-container"); 
    $(this).attr("data-ajax-update", $(this).attr("data-ajax-update") ? $(this).attr("data-ajax-update") : ajaxUpdate); 
    $(this).attr("data-ajax-mode", $(this).attr("data-ajax-mode") ? $(this).attr("data-ajax-mode") : "replace"); 
    $(this).attr("data-ajax-success", $(this).attr("data-ajax-success") ? $(this).attr("data-ajax-success") : "AjaxSuccess"); 
    $(this).attr("data-ajax-complete", $(this).attr("data-ajax-complete") ? $(this).attr("data-ajax-complete") : "AjaxComplete"); 
    $(this).attr("data-ajax-failure", $(this).attr("data-ajax-error") ? $(this).attr("data-ajax-error") : "AjaxError"); 
});