jquery - 使用 Razor 在一个 View 中使用两个模型

Question

我有一个 View ，我需要使用 2 个模型，因为我正在尝试自动完成盒子。 View就是像stackoverflow一样添加一个问题。您必须输入内容，并从自动完成中选择标签。

public class QuestionController : Controller
    {
        public ActionResult Add()
        {
            return View();
        }

        [HttpPost]
        public ActionResult Add(QuestionModel model)
        {
            if (ModelState.IsValid)
            {
                return RedirectToAction("Index", "Home");
            }
            else
            {
                return View(model);
            }
        }

        public ActionResult TagName(string q)
        {
            var tags = new List<TagModel>
                           {
                               new TagModel {Name = "aaaa", NumberOfUse = "0"},
                               new TagModel {Name = "mkoh", NumberOfUse = "1"},
                               new TagModel {Name = "asdf", NumberOfUse = "2"},
                               new TagModel {Name = "zxcv", NumberOfUse = "3"},
                               new TagModel {Name = "qwer", NumberOfUse = "4"},
                               new TagModel {Name = "tyui", NumberOfUse = "5"},
                               new TagModel {Name = "asdf[", NumberOfUse = "6"},
                               new TagModel {Name = "mnbv", NumberOfUse = "7"}
                           };

            var tagNames = (from p in tags where p.Name.Contains(q) select p.Name).Distinct().Take(3);

            string content = string.Join<string>("\n", tagNames);
            return Content(content);
        }

    }

命名空间 Szamam.Models { 公共(public)课问题模型 { 私有(private)字符串_content；

    public string Content
    {
        get { return _content; }
        set { _content = value; }
    }

    public UserModel Creator
    {
        get { return _creator; }
        set { _creator = value; }
    }

    public DateTime CreationDate
    {
        get { return _creationDate; }
        set { _creationDate = value; } 
    }

    public List<TagModel> TagModels
    {
        get { return _tagModels; }
        set { _tagModels = value; }
    }

    private UserModel _creator;

    private DateTime _creationDate;

    private List<TagModel> _tagModels=new List<TagModel>();
}

}

还有一个 View

@model Szamam.Models.QuestionModel
@{
    ViewBag.Title = "Add";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>
    Add</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.autocomplete.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Scripts/jquery.autocomplete.css")" rel="stylesheet" type="text/css" />
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>QuestionModel</legend>
        <div class="editor-label">
            @Html.LabelFor(model => model.Content)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Content)
            @Html.ValidationMessageFor(model => model.Content)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.CreationDate)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.CreationDate)
            @Html.ValidationMessageFor(model => model.CreationDate)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.TagModels)
        </div>
      @*here is a place for autocomplete for tags *@
     <div class="editor-label">
        @Html.LabelFor(model => model.Name)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Name) @Html.ValidationMessageFor(model => model.Name)
    </div>
        <script type="text/javascript">

            $(document).ready(function () {
                $("#TagName").autocomplete('@Url.Action("TagName", "Question")', { minChars: 3 });
            });

        </script>

        <p>
            <input type="submit" value="Create" />
        </p>


    </fieldset>
}

当然我有一个问题:

 @*here is a place for autocomplete for tags *@
         <div class="editor-label">
            @Html.LabelFor(model => model.Name)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Name) @Html.ValidationMessageFor(model => model.Name)
        </div>

在这一部分中，我想要另一个模型 - TagModel。

这是我第一次使用 Razor 漫长的一天，很抱歉这些愚蠢的问题:/

我在 stackoverflow 上看到过其他相关问题，但我认为这些答案对我没有帮助。

我可以在 View 中更改什么来运行此页面？

Answer 1

您应该创建一个具有 QuestionModel 和 TagModel 属性的 View 模型(例如 QuestionTagViewModel)。然后将 QuestionTagViewModel 传递给您要在其中使用它的 View 。

更新:

示例

public class QuestionTagViewModel {
    public QuestionModel {get;set;}
    public TagModel {get;set;}
}

您将能够像这样使用它:

Model.QuestionModel.Content

和:

Model.TagModel.Name

查看此处的示例:Viewmodels