jquery - 如何使用 Jquery 或其他简单操作在创建 View 上隐藏或显示表单组。 ASP.NET MVC 5

Question

如何隐藏或显示一个

<div class="form-group"> </div>

查看创建？ 按照代码:

<div class="form-group">
    @Html.LabelFor(model => model.vigencia, "Vigência", new { @class = "col-md-2 control-label" })
    <div class="col-md-4">
        <select id="vigencia" name="vigencia">
            <option value=""></option>
            <option value="1">Sim</option>
            <option value="0">Não</option>
        </select>            
        @Html.ValidationMessageFor(model => model.vigencia)
    </div>
</div>
//$("#blocovigencia").show();
//$("#blocovigencia").hide();
<div class="form-group" id="blocovigencia">
    @Html.LabelFor(model => model.data_inicio, "Data Início", new { @class = "control-label col-md-2" })
    <div class="col-md-4">
        @Html.TextBoxFor(model => model.data_inicio, new { @class = "form-control", placeholder = "Data Início", type = "date"})
        @Html.ValidationMessageFor(model => model.data_inicio)
    </div>
    @Html.LabelFor(model => model.data_limite, "Data Limite", new { @class = "col-md-2 control-label" })
    <div class="col-md-4">
        @Html.TextBoxFor(model => model.data_limite, new { @class = "form-control", placeholder = "Data Limite", type = "date" })
        @Html.ValidationMessageFor(model => model.data_limite)
    </div>
</div>

我的任务是:如果Vigencia的值为1则显示数据。如果为0则隐藏数据。

抱歉，如果我不直接。我不太懂英语。

Answer 1

您需要编写 jQuery 函数来执行此操作。下面的代码应该可以完成这项工作。它在页面加载期间添加一个 jQuery 事件，并且每当您更改下拉列表中的选择时就会触发 .change 事件。

$(document).ready(function(){ 
$("#vigencia").change(function () {
    var test = this.value;
    if(test == '1')
            $(".form-group").show();
    else
            $(".form-group").hide();
    }); 
});

这里是jsfiddle示例。