Question

目前我正在使用asp mvc视图我想在一个视图上呈现数据...在同一视图上有显示数据和创建表单但是无法完成。因为控制器返回IEnumerable类型数据并且创建表单的编辑器不包含该定义。

我有一个模型"T4.Models.Order"

如果我将此模型用作@model IEnumerable<T4.Models.Order>

创建表单razor语法显示错误

如果我将此模型用作@model T4.Models.Order

显示数据显示错误

这是我的代码

@model IEnumerable<T4.Models.Order>

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <p>
        @Html.ActionLink("Create New", "Create")
    </p>
    <table class="table table-striped table-bordered" cellspacing="0" width="100%">
     <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.CustomerID)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.CustomerID)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.OrderDate)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.RequiredDate)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShippedDate)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShipVia)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Freight)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShipName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShipAddress)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShipCity)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShipRegion)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShipPostalCode)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ShipCountry)
            </th>

        </tr>
    </thead>
        @*@{
            IEnumerable<T4.Models.Order> m = @model;
        }*@
    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.CustomerID)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.EmployeeID)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.OrderDate)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.RequiredDate)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ShippedDate)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ShipVia)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Freight)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ShipName)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ShipAddress)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ShipCity)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ShipRegion)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ShipPostalCode)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ShipCountry)
            </td>
        </tr>
    }

    </table>
</body>
</html>



@using (Html.BeginForm()) 
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Order</h4>
        <hr />
        @Html.ValidationSummary(true)

        <div class="form-group">
            @Html.LabelFor(model => model.CustomerID, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.CustomerID)
                @Html.ValidationMessageFor(model => model.CustomerID)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.EmployeeID, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.EmployeeID)
                @Html.ValidationMessageFor(model => model.EmployeeID)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.OrderDate, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.OrderDate)
                @Html.ValidationMessageFor(model => model.OrderDate)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.RequiredDate, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.RequiredDate)
                @Html.ValidationMessageFor(model => model.RequiredDate)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ShippedDate, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ShippedDate)
                @Html.ValidationMessageFor(model => model.ShippedDate)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ShipVia, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ShipVia)
                @Html.ValidationMessageFor(model => model.ShipVia)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Freight, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Freight)
                @Html.ValidationMessageFor(model => model.Freight)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ShipName, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ShipName)
                @Html.ValidationMessageFor(model => model.ShipName)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ShipAddress, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ShipAddress)
                @Html.ValidationMessageFor(model => model.ShipAddress)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ShipCity, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ShipCity)
                @Html.ValidationMessageFor(model => model.ShipCity)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ShipRegion, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ShipRegion)
                @Html.ValidationMessageFor(model => model.ShipRegion)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ShipPostalCode, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ShipPostalCode)
                @Html.ValidationMessageFor(model => model.ShipPostalCode)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ShipCountry, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ShipCountry)
                @Html.ValidationMessageFor(model => model.ShipCountry)
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}

控制器代码：

public ActionResult Index()
{
   return View(db.Order.ToList());
}

注意：我不想在控制器端更改任何内容。

Answer 1

如果要列出现有订单并在同一视图中显示创建表单，则应创建一个具有此属性的新视图模型。您可以从现有的T4.Models.Order继承此内容。

public class CreateAndListVm : T4.Models.Order
{
  public List<Order> Orders { set;get;}
  public CreateAndListVm()
  {
    this.Orders = new List<Order>();
  }
}

现在，您的视图将强烈输入此视图模型

@model CreateAndListVm
<h2>New item</h2>
@using(Html.BeginForm())
{
  @Html.TextBoxFor(s=>s.CustomerID)
  <input type="submit" />
}
<h3>Existing orders</h3>
@foreach(var item in Model.Orders)
{
  <p>@item.CustomerID</p>
}

当然，这意味着，您应该从您的行动方式中发送CreateAndListVm的对象。

public ActionResult Index()
{
  var vm = new CreateAndListVm();
  // to do : Load the orders to vm.Orders;
  return View(vm)
}

如果您不想更改控制器并且它正在向视图返回Order集合，那么您还有另一种选择。不要使用Html帮助器方法来生成输入表单字段。只需自己编写输入字段的html代码。

假设您的action方法返回Order类列表

public ActionResult Index()
{
  var orders = new List<Order>();
  return View(orders);
}

现在在您的视图中强烈键入Order

的集合

@model IEnumerable<Order>
<h2>Create</h2>
<form action="Create" method="POST">
  <input type="text" name="CustomerID" />
  <input type="submit" />
</form>
<h3>Existing orders</h3>
@foreach(var item in Model)
{
  <p>@item.CustomerID</p>
}

Answer 2

只需创建模型类的对象并用于渲染表单..

以下是代码

@{
    T4.Models.Order o = new T4.Models.Order();
}

您的表格

@using (Html.BeginForm("Create","Orders"))
    {
        @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Order</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => o.CustomerID, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.CustomerID, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.CustomerID, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.EmployeeID, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.EmployeeID, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.EmployeeID, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.OrderDate, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.OrderDate, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.OrderDate, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.RequiredDate, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.RequiredDate, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.RequiredDate, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.ShippedDate, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.ShippedDate, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.ShippedDate, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.ShipVia, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.ShipVia, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.ShipVia, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.Freight, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.Freight, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.Freight, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.ShipName, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.ShipName, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.ShipName, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.ShipAddress, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.ShipAddress, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.ShipAddress, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.ShipCity, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.ShipCity, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.ShipCity, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.ShipRegion, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.ShipRegion, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.ShipRegion, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.ShipPostalCode, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.ShipPostalCode, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.ShipPostalCode, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => o.ShipCountry, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => o.ShipCountry, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => o.ShipCountry, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
    }

    <div>
        @Html.ActionLink("Back to List", "Index")
    </div>

想在不同类型的同一视图上使用相同的模型两次？

2 个答案: