如何调用局部视图(基于AJAX的)直接在视图(MVC)的索引页索引的布局太视图、索引、局部、布局

2023-09-10 18:13:30 作者:春苔

让我更specific..What我想要做的是,当我点击一个子菜单,例如说某某是一个主菜单的子菜单ABC..when我点击XYZ通过AJAX加载的主网页,即ABC..the ajax的部分已经完成了我DNT如何通过菜单调用它....我会贴上我的code到B更清晰。

Let me be more specific..What i want to do is that when i click a submenu for example say XYZ is a sub menu of a main menu ABC..when i click XYZ it loads via ajax on the main page i.e ABC..the ajax part is done i dnt how to call it via menu....i'll paste my code to b more clear..

<li>@Html.ActionLink("About Us", "Index", "AboutUs")
    <ul>
        <li>@Html.ActionLink("Vision & Misson", "Index", "AboutUs")</li>
        <li>@Html.ActionLink("Our Ethics", "Index", "AboutUs")</li>
    </ul>
</li>

这是一个关于我们页,normaly它是针对其索引页面时,关于我们是clicked..HOw永远当你关于我们悬停在一个下拉菜单打开,显示更多选项: 愿景和使命 我们的道德......目前他们都被定向到索引 我想是,当我点击的愿景和使命,它应该打开愿景和使命的局部视图直接的关于我们的索引页... 类似'我们的道德页面被点击时就应该直接调用局部视图'我们的道德和对索引页显示它关于我们

this is an about us page, normaly it is directed to its INDEX page when about us is clicked..HOw ever when you hover on ABout US a drop down menu opens showing to more options: vision and mission our ethics......currently both of them are directed to index what i want is that when i click vision and mission, it should open the partial view of vision and mission directly on the index page of about us... similarly when 'our ethics' page is clicked it should directly call the partial view 'our ethics' and display it on index page of about us

推荐答案

更​​改@ Html.ActionLink为@ Ajax.ActionLink

Change your @Html.ActionLink to @Ajax.ActionLink

<li>@Html.ActionLink("About Us", "Index", "AboutUs")
    <ul>
        <li>@Ajax.ActionLink("Vision & Misson", "VisionAndEthics", new AjaxOptions {
                InsertionMode = InsertionMode.Replace, UpdateTargetId = "divTarget"
            })</li>
        <li>@Ajax.ActionLink("Our Ethics", "OurEthics", new AjaxOptions {
                InsertionMode = InsertionMode.Replace, UpdateTargetId = "divTarget"
            })</li>
    </ul>
</li>

插入模式属性设置为更换和UpdateTargetId属性是你想要把结果在HTML容器的id。

The insertion mode property is set to replace and the UpdateTargetId property is the id of the HTML container you want to put the result in.

然后在您的控制器

public PartialViewResult VisionAndEthics() {
    return PartialView("VisionAndMission");
}

public PartialViewResult OurEthics() {
    return PartialView("OurEthics");
}

此方式,您也可以处理客户端的JavaScript通过扩展该解决方案被关闭。

This way you could also handle clients with javascript turned off by extending this solution.

 
精彩推荐
图片推荐