在 div MVC 中加载部分视图答案

【问题标题】：Load partial view in a div MVC在 div MVC 中加载部分视图
【发布时间】：2012-04-05 00:42:23
【问题描述】：

单击它时我的 MVC 视图上有一个按钮，它应该通过调用将对象作为参数的操作在“div”中添加部分视图

我试过这样的东西：

$('#buttonId').onclick(function(){

$('#divid').load(@Html.Action("ActionName","ControllerName",new{parameterName = objectToPass}))

});

但它会在页面加载本身而不是单击按钮上加载 actionresult/部分视图

有什么想法吗？

【问题讨论】：

您需要Url.Action 才能获取网址。 Html.Action 将执行动作并返回视图结果。
同样你不能使用 URl.Action 传递一个对象
这个对象有多复杂？你可以只传递id吗？否则，将 HttpPost 对象作为 json 进行 ajax 调用，然后在响应处理程序中将 html 加载到 div 中。

标签： javascript jquery asp.net-mvc

【解决方案1】：

加载需要一个字符串，您正在生成一个可变路径如果您查看源代码，它会生成如下内容：

$('#buttonId').click(function(){
    $('#divid').load(yoururl/);
});

但你想要的是：

$('#buttonId').click(function(){
    $('#divid').load("yoururl/");
});

代码应如下所示：

$('#buttonId').click(function(){
    $('#divid').load('@Html.Action("ActionName","ControllerName",new{parameterName = objectToPass})');
});

但正如我所见，在您点击 #buttonId 之前，负载应该可以正常工作

【讨论】：

如何在 URL 中传递对象？-
你想给它添加一个字符串，而不是一个 url-path 的对象/变量，看最后一个例子
有问题我正在为局部视图调用一个动作，它以一个对象作为参数，而你所说的是给局部视图 URL 而不是调用一个动作，那么我该如何传递一个URL 中的对象????
你可以在你的代码隐藏中说if Request.IsAjaxRequest() { return ParitalView.... }

【解决方案2】：

尝试使用

@Url.Action

而不是

@Html.Action

也可以使用ajax，例如：

$('#buttonId').click( function() {
    $.ajax({
        type: 'POST',
        url: '@Url.Content("~/ControllerName/ActionName")',
        data: objectToPass,
        success: function (data) {
           $('#divid').innerHTML = data;
        }
    });
}

【讨论】：

为了帮助解释，HTML.Action 将生成并返回局部视图的 HTML。这是因为如果您希望它立即运行，并且它的用途会有所不同（直接使用，而不是通过 ajax。） URL.Action 创建一个用于请求部分视图的 URL 字符串。因此，如果您希望浏览器进行 ajax 调用以获取并呈现内容，则需要使用 URL。特别是如果您的计划是延迟/推迟调用，直到浏览器已经拥有主页。

【解决方案3】：

<script type="text/javascript">
    $(document).ready(function () {
        $('#buttonId').click(function () {
            $('#divid').load('@Url.Action("About", "Home")');
        });
    });
</script>

<a id="buttonId">Load partial view or Any URL</a>

<div id="divid" style="height:100px; width:400px";>

</div>

【讨论】：

【解决方案4】：

在 div MVC 4 中加载部分视图

最近我想在 Div 中加载 Partal View，经过大量的研发，这对我有用

$.ajax({
    type: 'POST',
    url: '@Url.Content("~/ControllerName/ActionName")',
    data: {
        title: title
    },
    success: function(result) {
        $('#divid').innerHTML = result;
    }
});

在部分视图中动作控制器代码

public PartialViewResult ShowCategoryForm(string title)
{
    Model model = new Model();
    model.Title = title;
    return PartialView("~/Views/ControllerName/PartalView.cshtml", model);
}

【讨论】：

【解决方案5】：

关于ajax调用成功函数追加结果

ajax 调用=>

url: 'controllername/methodname'
 success: function (partialviewresult)
{ 
          $('#div').append(partialviewresult);
}

  // inside controller
 public ActionResult methodname()
{
    return PartialView("~/a/a.cshtml");
}

并且控制器必须返回部分视图作为结果

【讨论】：

【解决方案6】：

html(data) 对我有用，而不是 innerHTML；

$('#buttonId').click( function() {
$.ajax({
    type: 'POST',
    url: '@Url.Content("~/ControllerName/ActionName")',
    data: objectToPass,
    success: function (data) {
       $('#divid').html(data);
    }
});}

【讨论】：