码迷,mamicode.com
首页 > 其他好文 > 详细

【easyUI】取消easyui行点击选中事件,智能通过勾选checkbox才能选中行

时间:2018-11-23 11:27:49      阅读:294      评论:0      收藏:0      [点我收藏+]

标签:UNC   add   str   cli   tin   class   cti   判断   win   

背景:项目中使用easyui作为前端架子。datagrid默认是点击行就选中此行然后变色。

需求:点击行不让此行选中;只能通过点击复选框才能选中某一行。

解决思路:

  1、写点击行函数function onClickRow(rowIndex,rowData){}

  2、查询当前datagrid所有选中行。

  3、遍历选中行。对比选中行索引和点击行的索引:如果点击行的索引在所有选中行中,则取消点击行的选中状态;如果不存在,则选中点击行。

代码:

<script type="text/javascript">
    // 行点击事件 
    function rowClick(rowIndex,rowData){
        var rows = $("#datagrid").datagrid(getSelections);
        var tag = true;
        // 判断是否刚刚选中 
        for(var i = 0;i<rows.length;i++){
            // 所有选中行中存在刚刚点击的行 则取消选中 
            if($(#datagrid).datagrid(getRowIndex, rows[i])==rowIndex){
                // 取消选中此行 
                $(#datagrid).datagrid(unselectRow,rowIndex);
                tag = false;
                break;
            }
        }
        // 判断是否刚刚取消
        if(tag){
            $(#datagrid).datagrid(selectRow,rowIndex);
        }
    }
</script>

延伸:

  在解决这个问题的时候看到js中Set对象的使用。如果使用Set对象,上面的代码则变成下面这样:

使用Set对象(此情景并不适用Set对象,为以后使用打下基础吧)

<script type="text/javascript">
    // 行点击事件 
    function rowClick(rowIndex,rowData){
        var rows = $("#datagrid").datagrid(getSelections);
        var set = new Set();
        // 判断是否刚刚选中 
        for(var i = 0;i<rows.length;i++){
            var currentIndex = $(#datagrid).datagrid(getRowIndex,rows[i]);
            set.add(currentIndex);
            // 所有选中行中存在刚刚点击的行 则取消选中 
            if(currentIndex==rowIndex){
                // 取消选中此行 
                $(#datagrid).datagrid(unselectRow,rowIndex);
            }
        }
        // 判断是否刚刚取消
        if(!set.has(rowIndex)){
            $(#datagrid).datagrid(selectRow,rowIndex);
        }
    }
</script>

 

【easyUI】取消easyui行点击选中事件,智能通过勾选checkbox才能选中行

标签:UNC   add   str   cli   tin   class   cti   判断   win   

原文地址:https://www.cnblogs.com/oldwei/p/10005929.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!