{{--下拉复选--}}
@extends('manager.layout.master')

@section('body')
    <form class="layui-form" method="post">
        <div class="layui-form-item">
            <label class="layui-form-label">多选2</label>
            <div class="layui-input-block" id="tag_ids2">

            </div>
        </div>

        <div id="msg_div">
            选择内容
        </div>
        <div class="layui-form-item" style="text-align:center;">
            <div class="layui-input-block">
                <button type="button" class="layui-btn" lay-submit="" lay-filter="demo">console.log</button>
            </div>
        </div>
    </form>
@stop

@section('js')
    <script>
        var tagData = [{"id":12,"name":"长者","status":0},{"id":13,"name":"工厂"},{"id":14,"name":"小学生"},{"id":15,"name":"大学生"},{"id":16,"name":"研究生"},{"id":17,"name":"教师"},{"id":18,"name":"记者"}];
        var tagIns2='';
        layui.use(['selectM'],function(){
            var selectM = layui.selectM;
            //多选标签-所有配置
            tagIns2 = selectM({
                //元素容器【必填】
                elem: '#tag_ids2'

                //候选数据【必填】
                ,data: tagData

                //默认值
                ,selected: [12,17]

                //最多选中个数，默认5
                ,max : 6

                //input的name 不设置与选择器相同(去#.)
                ,name: 'tag2'

                //值的分隔符
                ,delimiter: ','

                //候选项数据的键名
                ,field: {idName:'id',titleName:'name'}
            });
        });

        /**
         * 查看值
         */
        layui.form.on('submit(demo)',function(data){
            var msgDiv=$('#msg_div');
            msgDiv.empty();
            msgDiv.append('<p>'+'tagIns2 当前选中的值名：'+tagIns2.selected+'</p>');
            msgDiv.append('<p>'+'tagIns2 当前选中的值名：'+tagIns2.values+'</p>');
            msgDiv.append('<p>'+'tagIns2 当前选中的名：'+tagIns2.names+'</p>');
            console.log('tagIns2 当前选中的值名：',tagIns2.selected);
            console.log('tagIns2 当前选中的值：',tagIns2.values);
            console.log('tagIns2 当前选中的名：',tagIns2.names);
            var formData = data.field;
            console.log('表单对象：',formData);
        });
    </script>
@stop