显示/隐藏字段取决于DropdownlistFor HTML razor

时间:2016-10-11 09:19:45

标签: javascript jquery html asp.net-mvc razor

我有一个DropdownListFor字段,您将选择一个国家/地区名称:

        <div class="form-group">
        @Html.LabelFor(model => model.CountryCode, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownListFor(model => model.CountryCode, null, new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.CountryCode, "", new { @class = "label label-danger" })
        </div>
    </div>
如果用户选择埃及,则视图中的

将显示省份字段 - EG国家代码 - 所以我的Script.js:

    $("input[name='Address.CountryCode']").change(function () {

    if ($(this).val() == "true") {
        $("#EgyptianCitizen").slideDown();
    }
    else {
        $("#EgyptianCitizen").slideUp();
    }
});

省的HTML字段:

    <div class="form-group" id="EgyptianCitizen" style='@((Model != null && Model.CountryCode=="EG") ? "display: block;" : "display: none;")'>
    @Html.Label("GovernorateID", "Governorate", htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownListFor(model => model.GovernorateID, null, new { @class = "form-control" })
        @Html.ValidationMessageFor(model => model.GovernorateID, "", new { @class = "label label-danger" })
    </div>
</div>

但仍然没有工作......

1 个答案:

答案 0 :(得分:1)

只需检查浏览器html中的国家/地区代码...并将输入更改为选择,将真实值更改为所选值

$("Select[name='CurrentAddress.CountryCode']").change(function () {

    if ($(this).val() == "EG") {
        $("#EgyptianCitizen").slideDown();
    }
    else {
        $("#EgyptianCitizen").slideUp();
    }
});