如何在.cshtml中根据CheckBox值动态设置Kendo TextBox启用/禁用状态

直接通过Kendo UI官方客户端API结合复选框的change事件即可实现联动，不需要修改你现有的服务端控件渲染代码，具体实现如下：

• Kendo MVC的*For系列辅助方法会根据绑定的模型属性名自动生成DOM元素ID：绑定OrderNo的TextBox默认ID为OrderNo，绑定integration的CheckBox默认ID为integration，可以直接在客户端脚本中定位。
• 脚本逻辑需要覆盖两个场景：页面首次加载时，根据复选框的默认选中状态初始化输入框的可用状态；后续监听复选框的选中变化，实时切换输入框状态。
• 必须调用Kendo控件实例自带的enable()方法切换状态，不要直接操作DOM添加disabled属性，否则会绕过Kendo的状态管理，出现样式错乱、表单提交值异常的问题。

在页面中添加如下脚本即可：

<script>
$(function () {
    // 获取两个Kendo控件的实例
    const orderNoInput = $("#OrderNo").data("kendoTextBox");
    const integrationCheck = $("#integration").data("kendoCheckBox");

    // 定义状态切换逻辑
    const updateOrderNoStatus = function () {
        // 复选框选中（值为true）时启用输入框，未选中时禁用
        // 如果业务要求选中时禁用，把下面的check()改成 !check() 即可
        const isEnable = integrationCheck.check();
        orderNoInput.enable(isEnable);
    };

    // 页面初始化时执行一次，匹配初始状态
    updateOrderNoStatus();

    // 监听复选框选中变化，实时更新状态
    integrationCheck.bind("change", updateOrderNoStatus);
});
</script>

如果你在渲染控件时手动给控件设置了自定义ID，把脚本中jQuery选择器对应的ID替换成你自定义的值即可。

内容的提问来源于stack exchange，提问作者Abdullah