如何在点击时显示带参数的局部视图

时间:2017-01-10 14:54:22

标签: asp.net-mvc

我有一个人和电话的数据库,我创建了一个显示人物电话的局部视图。我希望这个patial视图在点击一些按钮时加载,比如ShowPhones或类似的东西。

这就是我称之为观点的方式     @ Html.Partial(“ShowPersonsPhones”,item.phones)

这是我的部分观点

@model IEnumerable<Project.Models.Phone>

<h2>Parial View</h2>
<table class="table">
<tr>
    <th>
        @Html.DisplayNameFor(model => model.Numer)
    </th>
    <th>
        @Html.DisplayNameFor(model => model.Model)
    </th>
</tr>
@foreach (var phone in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(item => phone.Numer)
        </td>
        <td>
            @Html.DisplayFor(item => phone.Model)
        </td>
    </tr>
}
</table>

编辑: 我试图在视图中做一些javascript,但它只是不起作用

<style>
.shown{
    display : inline;
}
.hidden{
    display : none;
}
</style>
@Scripts.Render("~/bundles/jquery")
<script type="text/javascript">
function show_partial(i) {
    alert("show partial " + i);
    var divsname = '#partial' + i;
    div = $(divsname);
    if (div.hasClass('hidden'))
    {
        div.removeClass("shown");
        div.addClass("hidden");
    }
    else
    {
        div.removeClass('hidden');
        div.addClass("shown");
    }
}
</script>

当我在它显示的功能中设置警报但由于某种原因没有更改类。

1 个答案:

答案 0 :(得分:0)

在按钮点击事件中,您可以加载局部视图。

<强>的ViewPage

<input type="button" id="btn" value="ClickMe" onclick="loadPartialView()" />
<div id="partialDiv"></div>

<script type="text/javascript">

    function loadPartialView() {
        $("#partialDiv").load('@Url.Action("IndexView","Home")');
    }
</script>

在Controller中,您可以使用参数返回部分视图。

public ActionResult IndexView()
        {
            return PartialView("_PartialView", db.Phones.ToList());
        }