基于layui、ssm的xm-select多选框回显及取值(维护多对多的关联表)

定义添加教师的js(列表操作+弹框)

  var arrSelect;
    //添加教师
    function addNews(edit){
        var index = layui.layer.open({
            title : "添加教师",
            type : 2,
            content : "/router/toteachersadd",
            success : function(layero, index){
                var body = layui.layer.getChildFrame('body', index);
                if(edit){
                    body.find(".name").val(edit.name);
                    body.find(".tnumber").val(edit.tnumber);
                    body.find(".id").val(edit.id);

                    body.find("input[name=sex]").each(function(){
                        if($(this).val()==edit.sex){
                            $(this).prop("checked", true);
                        }
                    })

                    /*edit.select是一个数组,存着班级id信息*/
                    arrSelect = edit.select;
                    var iframe = window['layui-layer-iframe' + index];
                    // 向子页面的全局函数child传参
                    iframe.child(arrSelect);
                    var time=new Date(edit.createtime);
                        time= time.toLocaleDateString()+ " "+time.toTimeString().slice(0,8)
                    body.find(".createtime").val(time);
                    form.render();
                }else {
                    // 获取子页面的iframe
                    var iframe = window['layui-layer-iframe' + index];
                    // 向子页面的全局函数child传参
                    arrSelect=null;
                    iframe.child(arrSelect);
                }
//注意。此处使用if else判断是添加还是编辑,因为两者共用一个add页面,两者都要进行一个跳转前传参的声明(即使参数为空),因为子页面使用了function(child)
                setTimeout(function(){
                    layui.layer.tips('点击此处返回列表', '.layui-layer-setwin .layui-layer-close', {
                        tips: 3
                    });
                },500)
            }
        })

子页面js(渲染一个xm-select对象)

//为此块渲染一个对象
<div class="layui-form-item">
                            <label class="layui-form-label">授课班级</label>
                            <div class="xm-select-demo layui-input-inline classlist" name="classlist" id="classlist" style="width: 400px"></div>
 </div>
 
 <script type="text/javascript">
            function child(arrSelect){
            //加载组件
            layui.config({
                base: '/sources/js/'
            }).extend({
                xmSelect: 'xm-select'
            }).use(['xmSelect'], function(){
                var xmSelect = layui.xmSelect;
                $.ajax({
                    url:"/classes/selectall?page=1&limit=100",
                    type:"get",
                    success:function(res){
                        data=res.data
                        arr=[];
                        for(var i in data){
                            arr.push({name: data[i].cname, value: data[i].id})
                        }
                        //渲染多选
                        var demo1 = xmSelect.render({
                            el: '#classlist',
                            data: arr
                        })
                        if(arrSelect!=null){
                            demo1.setValue(arrSelect)
                        }

                    }
                })
            })
            }
        </script>
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值