使用 Bootstrap 模态如何呈现

Question

我有一个大问题。我只想让我的创建 - 在我的索引视图中查看新的 VacationRequests

我不可能在一个视图中显示两个不同的模型。

@*@model System.Collections.Generic.IEnumerable<AppEule.Models.VacationRequest>*@
@model System.Collections.Generic.IEnumerable<GUIManagement.EmployeeVacationRequestViewItem>

@using System.Collections
@using System.Collections.Generic
@using AppEule.Models
@using TestAjax.Helpers

<h2>
    @{ViewBag.Title = "Urlaubsanträge";}
</h2>

@*<p>
    @Html.ActionLink("Create New", "Create")
</p>*@

<div class="table-responsive">


    <table id="mytable" class="table table-bordred table-striped">

        <thead>

            <th>Zeitraum</th>
            <th>Urlaubstage</th>
            <th>Vertreter</th>
            <th>Status</th>
            <th></th>
            <th></th>
        </thead>

        <tbody>

            @foreach (var item in Model)
            {
                <tr>
                    <td class="col-md-4">
                        @Html.DisplayFor(modelItem => item.VacationStartDateViewString) - @Html.DisplayFor(modelItem => item.VacationEndDateViewString)
                    </td>
                    <td class ="col-md-1">
                        @Html.DisplayFor(modelItem => item.NetVacationDaysViewString)
                    </td>
                    <td class="col-md-3">
                        @Html.DisplayFor(modelItem => item.ShiftPartnerFullName)
                    </td>
                    <td class="col-md-2">
                        @Html.DisplayFor(modelItem => item.VacationRequestProcessingStateViewString)
                    </td>
                    <td class="col-md-1">
                        @Html.NoEncodeActionLink("<span class='fa fa-info'></span>", "Details aneigen", "Details", "VacationRequests", routeValues: new { id = item.VacationRequestID }, htmlAttributes: new { @class = "btn btn-primary btn_small btn-sm" })
                    </td>

                    <td class="col-md-1">
                        @Html.NoEncodeActionLink("<span class='fa fa-ban'></span>", "Urlaubsantrag stornieren", "Delete", "VacationRequests", routeValues: new { id = item.VacationRequestID }, htmlAttributes: new { @class = "btn btn-danger btn_small btn-sm" })
                    </td>
                </tr>
            }
        </tbody>  
    </table>
    @Html.RenderPartial("~/Views/VacationRequests/_CreateVacationRequest.cshtml",  VacationManagement.VacationRequest() Vac);
</div>

如何访问或呈现局部视图？

@Html.RenderPartial("~/Views/VacationRequests/_CreateVacationRequest.cshtml", VacationManagement.VacationRequest() Vac);

这是局部视图。

@using System
@using System.Activities.Expressions

@model VacationManagement.VacationRequest

@{
    Layout = null;
}

<div class="modal fade" id="add" tabindex="-1" role="dialog" aria-labelledby="edit" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
            <div class="modal-header">
                <img src="~/Content/images/logo_dash.png" class="img-responsive center-block" alt="Responsive image">
                <h4 class="modal-title custom_align" id="Heading">Urlaubsantrag stellen</h4>
            </div>
            <div class="modal-body">
                @using (Html.BeginForm())
                {
                    @Html.AntiForgeryToken()
                    @*  @Html.AntiForgeryToken()*@
                    @Html.EditorFor(model => model.EmployeeID, new { htmlAttributes = new { @class = "form-control datepicker" } })
                    <div class="form-horizontal">
                        @Html.LabelFor(model => model.VacationStartDate, "Urlaubsbeginn", htmlAttributes: new { @class = "control-label" })
                        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                        <div class="form-group">
                            <div class="col-md-12">
                                @Html.EditorFor(model => model.VacationStartDate, new { htmlAttributes = new { @class = "form-control datepicker" } })
                                @Html.ValidationMessageFor(model => model.VacationStartDate, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        @Html.LabelFor(model => model.VacationEndDate, "Urlaubsende", htmlAttributes: new { @class = "control-label" })
                        <div class="form-group">
                            <div class="col-md-12">
                                @Html.EditorFor(model => model.VacationEndDate, new { htmlAttributes = new { @class = "form-control datepicker" } })
                                @Html.ValidationMessageFor(model => model.VacationEndDate, "", new { @class = "text-danger" })
                            </div>
                        </div>
                    </div>
                    <input type="submit" value="Create" class="btn btn-default" />
                }
            </div>
            <div class="modal-footer ">
                <button type="submit" value="Create" class="btn btn-success"> Speichern</button>
            </div>
        </div>
    </div>
</div>
<div>
    @Html.ActionLink("Back to List", "Index")
</div>

Answer 1

您需要将 VacationManagement.VacationRequest 的实例传递给分部视图。改变这个

@Html.RenderPartial("~/Views/VacationRequests/_CreateVacationRequest.cshtml", VacationManagement.VacationRequest() Vac);

至此

@{ Html.RenderPartial("_CreateVacationRequest", new VacationManagement.VacationRequest()); }

使用 Bootstrap 模态如何呈现

Using Bootstrap Modal how to Render

asp.net-mvc

asp.net-mvc-partialview

asp.net-mvc-4

twitter-bootstrap