Question

您好我仍然是网页设计和JavaScript等语言的新手。

在强类型的cshtml视图中，是否可以仅显示基于复选框的文本字段（文本字段和复选框都强烈键入模型？）我在下面创建了一个示例场景：

样本类：

namespace FruitSurveyNameSpace
{
    public class FruitSurvey 
    {
        public bool likesFruit { get; set; }
        public string fruitName { get; set; }
    }
}

示例cshtml：

<!DOCTYPE html>
@using FruitSurveyNameSpace
@model FruitSurvey
@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>
        <p>Like Fruit? @Html.EditorFor(model => model.likesFruit) </p>
        <p>Which Fruit: @Html.EditorFor(model => model.fruitName)</p>
    </fieldset>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

生成以下html

<form action="/" method="post">
  <input name="__RequestVerificationToken" type="hidden" value="blahValue" />
  <fieldset>
    <legend>Survey</legend>
    <p>likesFruit?
      <input class="check-box" data-val="true" data-val-required="The likesFruit field is required." id="likesFruit1" name="likesFruit1Name" type="checkbox" value="true" />
    </p>
    <p>fruitName
      <input class="text-box single-line" id="fruitName1" name="fruitName1Name" type="text" value="" />
    </p>
  </fieldset>
</form>

与上面的示例场景一样，只有当用户选择他/她喜欢水果（动态）时才输入水果名称才有意义。否则，水果名称输入没有任何意义，不应显示。此外，我们可能强制用户输入水果名称，一旦他/她选择像水果复选框（目前我在非动态生成的字段中使用[必需]属性，并且不确定如果变为动态它是否仍然有效。）

正如我们所看到的，两个值都是模型的强类型，这就是我使用html助手的原因。有没有办法在不使用JavaScript的情况下这样做？或者如果没有，我应该如何与html助手结合使用？

非常感谢提前。

Answer 1

要进行验证，您需要[RequiredIf]属性。在SO上有很多例子，你可以查看MVC Foolproof Nuget package

如Rowan所说，如果javascript不可接受，则需要2步向导。如果您可以使用javascript，那么只需根据复选框的选中状态切换文本框可见性。

基于上面的html

$('#likesFruit1').click(function() {
  $('#fruitName1').toggle();
});

这假设最初选中了复选框，并且文本框最初是可见的。另请注意，这只会切换文本框。如果您有关联标签和/或文本，其中所有元素都包含在容器中（例如div），那么您可能需要

$('#fruitName1').closest('div').toggle();

以便关联的元素也被切换。

根据复选框选择启用@ Html.editorFor

1 个答案: