我正在尝试使用mvc JavaScript函数启用/禁用下拉列表

时间:2019-03-06 17:28:44

标签: javascript asp.net-mvc razor

我尝试在未选中“启用”复选框时禁用这些下拉菜单。这是我的第一步,任何指导将不胜感激。

基本上禁用复选框时,我试图禁用下拉列表。选中复选框后,需要启用下拉菜单。

js:

$(document).ready(function () {
    if ($("#userPermissions").checked) {

        enableAll();
        console.log("enableAll");
    } else {
        disableAll();
        console.log("disableAll");
    }
})

$('#userPermissions').change(function (e) {
    //console.log('change');
    if (this.checked) {
        enableAll();
        console.log('change1');
    } else {
        disableAll();
        console.log('change2');
    }
});

function enableAll() {
    $("#userSettingsBottom  :input").prop("disabled", false);
    console.log("enabled");
}
function disableAll() {
    $("#userSettingsBottom  :input").prop("disabled", true);
    console.log("disabled");
}

cshtml:

<section class="well ">
<div class="row">
    <div class="col-lg-12 gutter-0">

        <div class="row gutter-0">                
            <div class="col-sm-6 col-md-6 col-lg-8">
                <div class="box-placeholder">
                    <div>
                        @Html.Label(Resources.USERS_Settings, htmlAttributes: new { @class = "control-label", maxlength = "15", style = "font-weight: bold; font-size: 15px; display: inline;" })
                    </div><br />
                    <div>
                        @Html.Kendo().CheckBoxFor(model => model.EnableUserLogin.BoolValue).Label(Resources.Users_EnableSecurity).HtmlAttributes(new { @class = "cti-db-numvalue cti-up-EnableUserLogin", id = "userPermissions", type = "checkbox" })

                        @Html.ValidationMessageFor(model => model.EnableUserLogin, "", new { @class = "text-danger" })
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-12 gutter-0">               
            <div class="col-sm-6 col-md-6 col-lg-8">
                <div class="box-placeholder">
                    @Html.Kendo().CheckBoxFor(model => model.EnableTransferOnLoginScreen.BoolValue).Label(Resources.Users_EnableTransferOnLoginScreen).HtmlAttributes(new { @class = "cti-db-numvalue cti-up-EnableTransferOnLoginScreen" })
                </div><hr />
            </div>
        </div>
    </div>
    <div class="col-sm-12 col-md-12 col-lg-12">
        <div class="row gutter-10">
            <div class="col-sm-6 col-md-6 col-lg-8">
                <div id="userSettingsBottom" class="box-placeholder" style="outline: none;">
                    <div>
                        @Html.Label(Resources.USERS_CustomFieldOption, htmlAttributes: new { @class = "control-label", style = "font-weight: bold; font-size: 14px; display: inline;" })&nbsp
                        @Resources.USERS_SelectedField
                    </div>
                    <div class="col-sm-4 col-md-4 col-lg-4">
                        <div>
                            @Html.Label(Resources.Users_InboundUserIDField, htmlAttributes: new { @class = "control-label" })
                        </div>
                        @Html.Kendo().DropDownListFor(model => model.InboundUserIDField).HtmlAttributes(new { @class = "cti-db-numvalue cti-up-InboundUserIDField" })
                    </div>
                    <div class="col-sm-4 col-md-4 col-lg-4">
                        <div>
                            @Html.Label(Resources.Users_DeliverUserIDField, htmlAttributes: new { @class = "control-label" })
                        </div>
                        @Html.Kendo().DropDownListFor(model => model.DeliverUserIDField).HtmlAttributes(new { @class = "cti-db-numvalue cti-up-DeliverUserIDField" })
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

1 个答案:

答案 0 :(得分:1)

由于这些是剑道下拉菜单,为什么不使用剑道功能?首先,名称应来自模型字段。在这种情况下,model.DeliverUserIDField的默认示例为

$("#DeliverUserIDField").data("kendoDropDownList").enable(false);