问如何从ASP.NET MVC 5中的模型创建表单？
EN

Stack Overflow用户

提问于 2015-03-03 14:00:30

回答 3查看 9.7K关注 0票数 5

是否有一个内置函数，基本上从模型中获取一个对象参数并在此基础上创建一个完整的表单？

目前，我正在为每个属性执行一行：

@model AutomatedTellerMachine.Models.ContactFormModel
@using (Html.BeginForm())
{
    <div class="form-horizontal">

        <div class="form-group">
            <div class="col-md-10">
                <input type="text" name="name" class="form-control" />
                @Html.ValidationMessageFor(model => model.name, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-10">
                <input type="text" name="phone" class="form-control" />
                @Html.ValidationMessageFor(model => model.phone, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-10">
                <textarea name="message" class="form-control"></textarea>
                @Html.ValidationMessageFor(model => model.message, "", new { @class = "text-danger"})
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-10">
                <input type="submit" value="Send" class="btn btn-default"/>
            </div>
        </div>
    </div>

}

我知道您可以让Visual为您创建所有的东西，但是我需要混合和匹配。

asp.net

asp.net-mvc

云点播特惠1元起

提供制作上传、存储、转码、媒体处理、媒体 AI、加速分发播放、版权保护等一体化的高品质媒体服务

回答 3

Stack Overflow用户

回答已采纳

发布于 2015-03-03 14:19:11

您可以使用编辑器模板来完成此操作。创建一个名为ContactFormModel.cshtml的新Razor视图(名称必须与模型匹配)。在该文件中，从现有视图复制所有代码。

您可以使用普通的Razor语法来呈现在此模型上调用EditorFor()时想要包含的任何HTML。

然后，可以让Razor使用以下命令呈现自定义模板：

@Html.EditorForModel(Model)

如果您想对模型中的特定对象(例如YourObjectName)执行同样的操作，而不是整个过程，那么创建一个名为YourObjectName.cshtml的文件。

在此文件的顶部：

@model NameSpace.YourObjectName

然后在要呈现自定义编辑器模板的外部视图中使用此方法：

@Html.EditorFor(model => model.YourObjectPropertyName)

票数 4

Stack Overflow用户

发布于 2015-03-03 14:15:26

好的，我算出来了，用：

@Html.EditorForModel(Model)

工作，但是是否有一种方法将类分配给它将要创建的所有元素？

票数 3

Stack Overflow用户

发布于 2015-05-11 07:18:48

也许你在找这个。

@Html.EditorFor(model => model, new { htmlAttributes = new { @class = " form-control" } })

“窗体控件”类被分配给输入字段。它将为每个属性生成此html。

<div class="editor-label"><label for="UserName">User Name</label></div>
<div class="editor-field">
  <input class=" form-control text-box single-line" data-val="true" data-val-length="The field User Name must be a string with a maximum length of 50." data-val-length-max="50" data-val-required="The User Name field is required." id="UserName" name="UserName" type="text" value=""> 
  <span class="field-validation-valid" data-valmsg-for="UserName" data-valmsg-replace="true"></span>
</div>

问题是

它将在单独的行中生成标签和输入。
标签和输入字段不在“form-group”div下分组。这使得定制样式变得很困难。

但周围总是有工作的。我曾经为标签区域和输入区域设计了一个表格，标签在左边对齐，输入用不同的背景色对齐。如果有人感兴趣的话，你可以这样做。

首先，用一些东西来命名您的表单，这样您的样式就不会影响其他表单。

#RegisterForm > .editor-label {
    float: left;
    width: 250px;
    background-color: lightblue;
    box-shadow: 0px 35px lightblue;
    padding-top: 10px;
}

#RegisterForm > .editor-label > label {
    float: right;
    padding-right: 5px;
}

#RegisterForm > .editor-field {
    margin-left:250px;
    background-color: yellowgreen;
    margin-bottom: 15px;
    box-shadow: 0px 15px yellowgreen;
    padding-left: 5px;
    padding-right: 20px;
}