AJAX调用局部视图

时间:2014-06-30 17:14:54

标签: c# javascript ajax asp.net-mvc

我在Web窗体中的遗留项目会在用户单击按钮时显示一个面板。我目前的项目是在C#MVC中重建此功能。

此视图将使用Javascript和AJAX按需显示部分视图。代码在调试器中正常流动,但不调用局部视图。

我已经使用SOF帖子来设置JS,以便正确显示包含局部视图的div。我在AJAX或其他地方缺少什么? (也许我需要修饰目标动作?也许我需要在局部视图中做一些事情?)

观点的相关部分:

<script type="text/javascript">

//Show the Add Project section.
function NewProject() {
    //1. Reset the Add Project partial view.
    //2. Show the Add Project partial view.
    //3. Put focus into the project title field.
    //4. Hide the button.
    $("#divNewProject").show();
    $.ajax({
        url: "/Organization/AddProject/"
    }).done(function () {
        $("#divNewProject").html(data);
        $("#ProjectTitle").focus();
        $("#ProjectTitle").scrollIntoView();
    });
    $("#divAddProject").hide();
}
</script>

...

<div id="divAddProject">
    @* Button to add a project, showing/hiding a partial view *@
    <button type="button" name="btnAddProject" id="btnAddProject" value="Add" onclick="NewProject()" class="btn">
        <span class="wizard-step-text">Add New Project</span>
    </button>
</div>
<div id="divNewProject" hidden="hidden">
    This is a test. It should start out hidden and later be shown.
</div>

3 个答案:

答案 0 :(得分:1)

你可以这样做:

function NewProject() {

$("#divNewProject").show();
    $.ajax({
        url: '@Url.Action("AddProject","Organization")',
        success : function(data)
        {

        $("#divNewProject").html(data);
        $("#ProjectTitle").focus();
        $("#ProjectTitle").scrollIntoView();
        $("#divAddProject").hide();

        }
    });


}

答案 1 :(得分:1)

里面的功能应该有&#34;数据&#34;作为参数。

$.ajax({
    url: "/Organization/AddProject/"
}).done(function (data) {
    $("#divNewProject").html(data);
    $("#ProjectTitle").focus();
    $("#ProjectTitle").scrollIntoView();
});

答案 2 :(得分:0)

调试时,在done函数内设置断点。应该点击,你会发现你还没有定义data变量。

应该是:

}).done(function(data) {
    // Do something with data
})