在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"); 
});