layui 複数選択ドロップダウン ボックス、複数選択

1 まず、xm-select.js をダウンロードします。layui.js にある場合は必要ありません。js 内の xmSelect オブジェクトは、xm-select.js を参照した後に直接使用できます。

2 複数選択のドロップダウン ボックスのラベルを追加します

 <div class="layui-inline" style="width: 350px;">
                <label class="layui-form-label">
                    行业类型：
                </label>
                <div class="layui-input-inline">
                    <div id="IndustryType" class="xm-select-demo" style="width: 300px"></div>
                </div>
            </div>

3 js上のドロップダウンデータを取得する

 $.ajax({
            Type: "post",
            url: "/Collect/getBid_ProjectType",
            success: function (res) {
                var res = JSON.parse(res);
                var dataIndustryType = [];
                for (var i = 0; i < res.data.length; i++) {
                   
                    if (res.data[i].reid == 3) {
                        dataIndustryType.push(res.data[i]);
                    }
                }
                webdata = xmSelect.render({
                    el: '#IndustryType',
                    tips: '请选择',
                    prop: {
                        name: 'name',
                        value: 'id',
                    },
                    filterable: true,
                    data: dataIndustryType,
                    on: function (data) {
                        var arr = data.arr;
                        if (arr.length > 0) {
                            //先查看arr中有没有空的数组元素
                            for (var j = 0; j < arr.length; j++) {
                                if (arr[j].id == undefined) {
                                    arr.splice(j,1);
                                }
                            }

                            for (var i = 0; i < arr.length; i++) {
                                if (oarr=="") {
                                    oarr += arr[i].id + ',';//寻找键值对赋值
                                }
                                else if (arr[i].id != undefined && oarr.indexOf(arr[i].id) < 0) {
                                    oarr += ','+ arr[i].id + ',';//寻找键值对赋值
                                }
                            }
                        //选中项id
                            oarr = oarr.substring(0, oarr.length - 1);
                        }
                       //记录选中项id
                        $('#IndustryTypeid').val(oarr);
                       
                    },
                });

                //栏目选中，修改时获取之前的数据，设置选中
                var IndustryType = $('#oldIndustryType').val();
                var IndustryTypearr = IndustryType.split(',');
                for (var i = 0; i < IndustryTypearr.length; i++) {
                    var a = IndustryTypearr[i];
                    if (a != '0' && a != '') {
                    //下面代码是 动态选中
                        webdata.append([a]);
                    }
                }

                $("#SourceAuthority").val($('#oldSourceAuthority').val());

                form.render();
            }
        })