MVC Partial View使用jquery.get()而不是Ajax.BeginForm触发Document.Ready()

时间:2013-01-02 16:46:21

标签: jquery ajax asp.net-mvc

我最近注意到MVC的Ajax.BeginForm在返回视图时表现得很糟糕。起初一切看起来都不错,但后来我意识到文件准备中发生的所有绑定都丢失了。文件就绪没有被执行。

知道这在其他地方工作,我发现用jquery做同样的事情确实执行文件准备好了。但据我所知,这两种方法从根本上做同样的事情。我的快速解决方法是删除帮助程序的Replace TargetId实现,并使用它AjaxOptions.OnSuccess来调用我的jquery.get()实现。

但是,当我使用jquery.get()时,为什么文档会准备就绪,而当我使用Ajax.BeginForm替换div时呢?


// This method returns a the partial view from DoSomething, but DOES NOT execute the 
// partial view's document.ready
using (Ajax.BeginForm("DoSomething", "Somewhere", new AjaxOptions { HttpMethod = "Post", InsertionMode = InsertionMode.Replace, UpdateTargetId = "demo" }))
{ %>
    <div id="demo"></div>
<% } %>

示例1.用于替换div的MVC Helper方法


// This method returns nothing from DoSomething, calls getSomething onSuccess and DOES 
// execute the partial view's document.ready
using (Ajax.BeginForm("DoSomething", "Somewhere", new AjaxOptions { HttpMethod = "Post", OnSuccess = "function() { getSomething(); }" }))
{ %>
    <div id="demo"></div>
<% } %>

// this being the simplified js function
function getSomething(){
    var $targetDiv = $("#demo");
    var url = "<%: Url.Action("LoadSomething", "Somewhere")  %>";
    $.get(url, { }, function (result) { $targetDiv.html(result) });
});

示例2.用于替换div的jquery.get()方法

1 个答案:

答案 0 :(得分:2)

我可以建议alternative如何在没有JavaScript代码的情况下构建丰富的应用程序,如Ajax.BeginForm,但更灵活和可自定义。

示例:从控制器获取html并插入dom元素。

<div id="containerId"></div>
 @(Html.When(JqueryBind.Click)
       .Do()
       .AjaxGet(Url.Action("GetContent", "SomeController"))
       .OnSuccess(dsl => dsl.With(r=> r.Id("containerId"))
                            .Core()
                            .Insert
                            .Html())
       .AsHtmlAttributes()
       .ToButton("Insert button"))

您可以将任何dom值用于

等请求
AjaxGet(Url.Action("GetContent", "SomeController",new 
                                       {
                                         Criterie=Selector.Jquery.Name("txtName")
                                        } ))

您可以在official文档上查看示例,并从github下载示例项目sample