2

我的控制器动作是：

        public ActionResult PVInPage()
        {
            return View();
        }

        public ActionResult ViewPage2()
        {
            return PartialView();
        }

我的主要观点：

@using (Html.BeginForm("ViewPage2", "PartialViewInPage"))
{    
    <input type="submit" value="Call Page Two" />  
}

<div id="DisplayPartilView">

        @*display partial view *@

</div>

我的部分观点是：

  @{
        ViewBag.Title = "View Page 2";
    }

    <div style="width:500px; height:200px; background-color:Gray" >


     <h1> This is my Partial view </h1>

    </div>

现在我想做：当我在主视图中单击提交按钮时，我的部分视图出现在

我的主视图内部 div 带有 id="DisplayPartilView"。感谢您的回复

4

3 回答 3

1

如果您想将 data/html 加载到页面中而不导航到其他页面，则需要使用 Ajax。

ASP.Net MVC 提供了一组使用 Ajax 的助手（它们都在后台使用jQuery.Ajax，因此您始终可以返回到一个级别并手动编写您的 ajax 调用）。

但在您的情况下，Ajax.BeginForm它提供了您需要的一切：

因此，将您的主视图更改为：

@using (Ajax.BeginForm("ViewPage2", "PartialViewInPage", 
        new AjaxOptions() { UpdateTargetId = "DisplayPartilView" }))
{    
    <input type="submit" value="Call Page Two" />  
}

<div id="DisplayPartilView">

        @*display partial view *@

</div>

为了使其工作，您需要在主视图或 jQuery 之后的布局文件中引用以下脚本：

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
于 2012-10-01T06:42:57.310 回答
0 
@using (Html.BeginForm("ViewPage2", "PartialViewInPage"))

将刷新页面，这就是您需要的原因ajax

.serialize()从所有输入中获取数据，.ajax()发出post请求，然后设置部分：

$('#DisplayPartilView').html(response);
于 2012-10-01T06:43:25.770 回答
0

在我的项目中，我正在这样做，它在下面

这是我的按钮，我点击然后我的部分视图像这样加载到我的 div 中

<script type="text/javascript">
    $(function () {
        $("#btnLode").click(function () {
            $("#LodeForm").load("/City/ShowAllState", function () {
                alert("Your page loaded Successfully !!!!!!!");
            });
        });
    });

</script>

<div id="LodeForm">
</div>

这是这个问题的另一个解决方案

@using (Ajax.BeginForm("SearchCountry", "City",
    new AjaxOptions
    {
        InsertionMode = InsertionMode.Replace,
        HttpMethod = "Get",
        LoadingElementId = "ajax-loader",
        UpdateTargetId = "CountryListID",
    }))
{

    <input type="submit" value="search Country" data-autocomplete-source="@Url.Action("SearchCountry", "City")" />        
}
<div id="CountryListID">
</div>

我想这会对你有所帮助

于 2012-10-01T06:46:08.577 回答