layui中select下拉框控件监听，赋值操作

最新推荐文章于 2024-06-13 09:41:41 发布

zhang123csdn

最新推荐文章于 2024-06-13 09:41:41 发布

阅读量914

点赞数

文章标签： layui javascript 前端

本文链接：https://blog.csdn.net/zhang123csdn/article/details/122574946

版权

1 html实例

<div class="layui-form-item">
                    <label for="L_pass" class="layui-form-label">
                        用户组：
                    </label>
                    <div class="layui-input-inline">
                        <select id="L_Group" name="L_Group" lay-search="" lay-filter="demo"></select>
                    </div>
                </div>

2 js赋值`

 //初始化用户组下拉信息
            $.ajax({
                type: 'post',
                url: '../../WebApi/GroupCommon.ashx?action=GetListdata',//数据接口
                success: function (res) {
                    var data = JSON.parse(res);
                    $.each(data.data, function (index, item) {
                        // 下拉菜单里添加元素
                        $('#L_Group').append(new Option(item.typename, item.id));
                    });
                    form.render();
                }
//动态选中
//id是要选中的元素id
$('#L_Group').val(id);

3 js监听指定select控件监听 demo值是select标签的lay-filter="demo"值

 form.on("select(demo)", function (data) {
        var value = data.value;
        //机构选择一级栏目，只能是平台设设置的栏目类型
        if (value == 2) {
            $('#CategoryNameSelect').show();
            $('#CategoryNameInput').hide();
            //获取平台设置的固定栏目类型
            $.ajax({
                type: 'get',
                async: false,
                url: url3,
                success: function (res) {
                    $('#CategoryName2').empty();
                    $.each(res.data, function (index, item) {
                        // 下拉菜单里添加元素
                        $('#CategoryName2').append(new Option(item.ItemCode, item.Id));
                    });
                    form.render();
                }
            })
        }
        else {
            $('#CategoryNameSelect').hide();
            $('#CategoryNameInput').show();
        }
    })