在 div MVC 中加載部分視圖

Question

單擊它時，我的 MVC 視圖上有一個按鈕，它應該通過調用一個以 object 作為參數的操作在“div”中添加一個局部視圖

我嘗試了這樣的事情：

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

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

});

但它會在頁面加載本身而不是單擊按鈕時加載操作結果/部分視圖

任何想法？

Answer 1

嘗試使用

@Url.Action

代替

@Html.Action

或者您可以使用ajax，例如：

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

Answer 2

在div MVC 4中加載局部視圖

最近我想在進行大量研發后加載部分視圖，這對我來說很有用

$.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);
}

Answer 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>

Answer 4

load需要一個字符串，如果你看一下你生成的源代碼，就會生成一個變量路徑：

$('#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

Answer 5

在ajax調用成功函數追加結果

ajax call =>

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

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

和控制器必須返回部分視圖作為結果

Answer 6

html(data) 代替 innerHTML 為我工作；

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