zoukankan      html  css  js  c++  java
  • easyui的combobox带checkbox的全选功能

    var getData = function () {
        var data;
        $.ajax({
            url: '/getMATTypeList',
            type: 'get',
            async: false,
            success: function (result) {
                data = result;
                //数组头部添加元素
                data.unshift({"G_MATTYPENAME": "全选", "G_MATTYPECODE": ""});
            }
        });
        return data;
    }
    
    function  initMatTypeCombobox(){
        $('#G_MATTYPECODE').combobox({
            valueField: 'G_MATTYPECODE',
            textField: 'G_MATTYPENAME',
            multiple: true,
            editable: false,
            panelHeight: 200,
            readonly: false,
            data: getData(),
            onClick: function (record) {
                var valueField = $("#G_MATTYPECODE").combobox("options").valueField;
                if (!record[valueField]) {
                    var data = $("#G_MATTYPECODE").combobox("getData");
                    var values = $("#G_MATTYPECODE").combobox("getValues");
                    var selectVaues = [];
                    if ((data.length - 1) != values.length) {
                        data.reduce(function (prev, current, index, array) {
                            selectVaues.push(current[valueField]);
                        }, selectVaues);
                    } else {
                        selectVaues.push(record[valueField]);
                    }
                    $("#G_MATTYPECODE").combobox('setValues', selectVaues);
                }
            },
            formatter: function (row) { //formatter方法就是实现了在每个下拉选项前面增加checkbox框的方法
                var opts = $("#G_MATTYPECODE").combobox('options');
                return '<input type="checkbox" class="combobox-checkbox">' + row[opts.textField]
            },
            onSelect: function (row) { //选中一个选项时调用
                var opts = $(this).combobox('options');
                //设置选中值所对应的复选框为选中状态
                var el = opts.finder.getEl(this, row[opts.valueField]);
                el.find('input.combobox-checkbox')._propAttr('checked', true);
            },
            onUnselect: function (row) {//不选中一个选项时调用
                var opts = $(this).combobox('options');
                var el = opts.finder.getEl(this, row[opts.valueField]);
                el.find('input.combobox-checkbox')._propAttr('checked', false);
            }
        });
    }
  • 相关阅读:
    ThinkPHP 实现数据库事务回滚示例代码
    Java数据结构和算法
    Java数据结构和算法
    Java数据结构和算法
    git push每次提交都要输入用户名的解决方案
    Java数据结构与算法
    Java数据结构和算法
    Java数据结构和算法
    类和接口
    git如何忽略文件
  • 原文地址:https://www.cnblogs.com/xiaoruilin/p/14865852.html
Copyright © 2011-2022 走看看