模态渲染视图

时间:2019-01-18 09:25:30

标签: c# asp.net-mvc asp.net-core modal-dialog render

我正在尝试以模态渲染视图,但是我不知道该怎么做。

我尝试通过创建局部视图来解决问题,但是无法在家庭控制器中(加载时)触发方法。

我想知道,是否可能有局部视图触发控制器中的方法,还是应该将其更改为临时视图(我没有设法显示它)?

视图:

@model IEnumerable<CharityProject.Models.UserInfos>

@{
    ViewData["Title"] = "SelectAddress";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Select Address</h2>

<p>
    @* <input type="button" value="Add New Address" onclick="location.href='@Url.Action("Create", "UserInfos")'" />*@
    <input type="button" data-toggle="modal" data-target="#myModal" value="Add New Address" class="btn btn-default">
</p>
<div class="row">
    <div class="col-md-6">
        <table class="table">
            <thead>
                <tr>
                    <th>
                        @Html.DisplayNameFor(model => model.Cities)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.Area)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.Address)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.POB)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.PhoneNo)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.PhoneNo2)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.IsDefault)
                    </th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                @foreach (var item in Model)
                {
                    <tr>
                        <td>
                            @Html.DisplayFor(modelItem => item.Cities.CityName)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Area)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Address)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.POB)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.PhoneNo)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.PhoneNo2)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.IsDefault)
                        </td>
                        <td>
                            <a asp-action="Edit" asp-route-id="@item.Id">Edit</a> |
                            <a asp-action="Details" asp-route-id="@item.Id">Details</a> |
                            <a asp-action="Delete" asp-route-id="@item.Id">Delete</a>
                        </td>
                    </tr>
                }
            </tbody>
        </table>
    </div>
    <div class="col-md-6">


    </div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body">
                ...
                **@{await Html.RenderPartialAsync("CreateAddress", new UserInfos());}**
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" uiactions="@Url.Action("Create", "UserInfos")" formmethod="post">Save changes</button>
            </div>
        </div>
    </div>
</div>

家庭控制器:

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

2 个答案:

答案 0 :(得分:0)

到目前为止,我还没有使用过Net Core,但仍处于学习过程中,但是根据我记得的经典MVC方法(.NET)

创建一个AJAX方法,该方法将使用

将数据发送到控制器
  

@ Html.Action / @ Html.ActionLink / @ Url.Action等

部分视图应该有权访问主视图的Model对象(如果您执行@ Html.Partial)

答案 1 :(得分:0)

如果您使用的是ASP.NET Core,则应使用查看组件。

创建一个从ViewComponent派生的类,其中包含InvokeAsync方法:

public class AddressViewComponent : ViewComponent
{
    public async Task<IViewComponentResult> InvokeAsync()
    {
        return View();
    }
}

将视图放入此路径结构“ /Views/Shared/Components/Address/Default.cshtml”。

然后,以模态渲染组件:

<div class="modal-body">
    @await Component.InvokeAsync("Address")
</div>