gpt4 book ai didi

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

转载 作者:行者123 更新时间:2023-11-28 01:04:57 27 4
gpt4 key购买 nike

嗨,我对网页设计和语言(包括 JavaScript)还很陌生。

在强类型 cshtml View 中,是否可以仅显示基于复选框的文本字段(其中文本字段和复选框都对模型强类型化?)我创建了一个示例场景:

示例类:

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>

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

正如我们所看到的,这两个值都是强类型化到模型的,这就是我使用 html 助手的原因。有没有一种方法可以在不使用 JavaScript 的情况下做到这一点?或者如果没有,我应该如何与 html 助手结合使用?

提前非常感谢。

最佳答案

对于验证,您需要一个 [RequiredIf] 属性。 SO 有很多例子,或者你可以看看 MVC Foolproof Nuget package

正如 Rowan 所指出的,如果 javascript Not Acceptable ,则需要一个两步向导。如果您可以使用 JavaScript,那么只需根据复选框的选中状态切换文本框可见性即可。

基于上面的html

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

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

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

这样关联的元素也会被切换。

关于javascript - 根据复选框选择启用@Html.editorFor,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25194119/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com