<select> 用于许多实体

Question

我有Aircraft 和FleetItem 的模型：

Aircraft.cs：

public class Aircraft : IDbEntity
{
    [Key]
    public int Id { get; set; }

    public string Type { get; set; }

    public int? MaxAltitude { get; set; }

    public int? MaxSpeed { get; set; }

    public int? NOfFirstClassSeats { get; set; }

    public int? NOfBusinessClassSeats { get; set; }

    public int? NOfEconomyClassSeats { get; set; }
}

FleetItem.cs：

public class FleetItem : IDbEntity
{
    [Key]
    public int Id { get; set; }

    public string RegNumber { get; set; }

    public int AirplaneId { get; set; }

    [ForeignKey("AirplaneId")]
    public virtual Aircraft Airplane { get; set; }
}

所以，实际上 - FleetItem 包含 Aircraft 的外键和飞机的注册号（regnumber 是唯一的）。

查看我现在拥有的 Index.cshtml：

@model Core.Models.FleetItem
@{
    ViewData["Title"] = $"Add new plane to fleet";
}

<h2>@ViewData["Title"]</h2>

<form method="post" asp-controller="Fleet" asp-action="Add" asp-antiforgery="true">
    <!-- todo add plane select -->

    <div class="form-group">
        <label asp-for="RegNumber" class="control-label">Registration number:</label>
        <input asp-for="RegNumber" class="form-control" type="text" />
        <span asp-validation-for="RegNumber"></span>
    </div>
    <div class="form-group">
        <input type="submit" value="Add" class="btn btn-default" />
    </div>
</form>

我需要链接FleetItem 和Aircraft。

我找到的解决方案：选择所有飞机并将它们传递到视图中并使用<select> 输出。

当我有几架飞机时，此解决方案适用。但是，如果我有 1000 多架飞机呢？对于<select> 列表来说，它太大了。所以，我考虑任何返回飞机的搜索。会很棒的。但是，如何实现呢？我认为该解决方案存在于某处，但我找不到。

或者您能提出最佳解决方案吗？

Answer 1

就用户体验而言，最好的选择是添加一个搜索框，该框将继续过滤您在飞行中的飞机，即它会向服务器发出请求以显示前 10 个元素。这是实现此类功能的常用方法。

我不确定你是否可以轻松地直接在 MVC 模型中实现，但如果你有一些客户端框架，你可以使用它来实现这一点。例如。您可以使用流行的select2 控件来执行此类操作。正如它的名字所暗示的那样，它是对普通选择的一种改进，可以添加你需要的所有东西。

当然，对于一个带有普通输入和 div 弹出窗口的简单案例，您总是可以自己实现它。

附：您可以搜索一下如何将 select2 与 MVC 连接，例如here。但通常这应该没什么大不了的，因为它只是 Web api 中的一些 AJAX 请求，您需要支持数据 + 一些客户端脚本来将其连接到您的模型。