多选按钮 checkbox

步骤

1.字典类型

http://localhost:9000/admin/SysDictType/list  //用于添加字典类型

2.字典明细

http://localhost:9000/admin/SysDictItem/list  //用于添加字典类型下的明细

3.获取字典对象

@Autowired

DictItemDao dictItemDao;   

4.通过字典对象获取数据

List<SysDictItemInfo>  list= dictItemDao.getDictList("字典类型名称");  //SysDictItemInfo是专门保存字典明细的VO

5.存储到controlData里面

6.前端控件显示

#{list items:data.controlData.存储的字典名称, as:'别名'}

   <input type="checkbox" class="form-control"  data-bind="attr: {name:'实体属性名称',value: ${别名.code}}, checked: $root.code" />
   <span>${sl.name}</span>
#{/list}

7.初始化时绑定

page.register("binding",function(){   //代表页面绑定
              data.code = ko.computed({               //data.root代表root.code,ko.computed是一个依赖方法
                                    read: function () {        //
                                                var flags = [];
                                                var value = data.models.model.service();
                                                         $.each(data.controlData.serviceList, function (i, item) {
                                                                     if(isNaN(value)){
                                                                             for(var i = 0 ; i < value.length ; i++ ){
                                                                                      var valueInt = value[i];
                                                                                      if((item.code & valueInt) == item.code) {
                                                                                       flags.push(item.code.toString());
                                                                                      }
                                                                              }
                                                                       }else{
                                                                             if((item.code & value) == item.code) {
                                                                             flags.push(item.code.toString());
                                                                       }
                                                           }
                                         });
                                return flags;
                   },
                   write: function (newValue) {
                                data.models.model.service(newValue);
                    }
                });
});

猜你喜欢

转载自www.cnblogs.com/SHZX/p/9559053.html