javascript代码实例教程-FlexiGrid支持shift多选

发布时间:2019-02-20 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-FlexiGrid支持shift多选脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。 在前面几章Flexigrid处理的基础上,处理了支持shift多选的功能,增加的代码标注了“//处理shfIT多选 add by danielinbiti”

 

主要增加了三部分代码

 

第一部分

 

[javascript]  

(function ($) {  

    $.adDFlex = function (t, p) {  

        if (t.grid) return false; //return if already exist  

        p = $.extend({ //apply default PRoPErties  

            height: 200, //default height  

            width: 'auto', //auto width  

            striped: true, //apply odd even stripes  

            novstripe: false,  

            minwidth: 30, //min width of columns  

            minheight: 80, //min height of columns  

            resizable: true, //allow table resizing  

            url: false, //URL if using data From AJAX  

            dwrAction:function(){},  

            method: 'POST', //data sending method  

            dataType: 'XMl', //type of data for AJAX, either xML or JSON  

            errormsg: 'Connection Error',  

            usepager: false,  

            nowrap: true,  

            page: 1, //current page  

            total: 1, //total pages  

            useRp: true, //use the results per page select box  

            rp: 15, //results per page  

            rpOptions: [10, 15, 20, 30, 50], //Allowed per-page values   

            title: false,  

            pagestat: 'Displaying {from} to {to} of {total} items',  

            pagetext: 'Page',  

            outof: 'of',  

            findtext: 'Find',  

            proCMSg: 'Processing, please wait ...',  

            query: '',  

            qtype: '',  

            isColSel:true,  

            nomsg: 'No items',  

            minColToggle: 1, //minimum allowed column to be hidden  

            showToggleBTn: true, //show or hide column toggle popup  

            hideOnSubmit: true,  

            autoload: true,  

            blockOpacity: 0.5,  

            preProcess: false,  

            onDragCol: false,  

            onToggleCol: false,  

            onChangeSort: false,  

            onSuccess: false,  

            onError: false,  

            onRowClick:function(){return true},//add by jej  

            onSubmit: false //using a custom populate function  

        }, p);  

        $(t).show() //show if hidden  

            .attr({  

                cellPadding: 0,  

                cellSpacing: 0,  

                border: 0  

            }) //remove padding and spacing  

            .removeAttr('width'); //remove width properties  

        //create grid class  

        isEditing = false;  

        isShiftMulti = false;  //处理shfit多选 add by danielinbiti  

        shiftSelRowIndex = -1; //处理shfit多选 add by danielinbiti  

        $('body').keydown(function (e) { //处理shfit多选 add by danielinbiti  

                if (e.keyCode == 16) {    

                    isShiftMulti=true;    

                }  

        });  

        $('body').keyup(function (e) { //处理shfit多选 add by danielinbiti  

                if (e.keyCode ==16) {  

                    isShiftMulti=false;  

                    shiftSelRowIndex = -1;  

                }  

        })  

 

第二部分

[javascript]  

getSelectRowsToGrid: function(){//处理shfit多选 add by danielinbiti  

                //add by jej  

                VAR rtnList = new Array();  

                var objRows = $('.trSelected', $(t));  

                if(objRows!=null){  

                    for(var i=0;i<objRows.length;i++){  

                         var row = objRows[i];  

                         var arr = new Array();  

                         for(var j=0;j<row.cells.length;j++){  

                               if(isEditing && p.colModel[j].isEdit){  

                                  var td = row.cells[j];  

                              var p = $('p',$(td));  

                              var inputbox = $('input',$(p[0]));  

                              if(inputbox.length>0){  

                                             arr[j] = inputbox[0].value;  

                                      }  

                                 }else{  

                               var value = row.cells[j].innerText;  

                               value=value.replace(/^/n+|/n+$/g,"");  

                               arr[j] = value;  

                           }  

                       }  

                       rtnList[rtnList.length] = arr;  

                  }  

                }  

                return rtnList;  

            }  

 

第三部分

[javascript]  

addRowProp: function () {  

                var _self = this;  

                $('tbody tr', g.bDiv).each(function () {  

                    $(this).click(function (e) {  

                        var obj = (e.target || e.srcElement);  

                        if (obj.href || obj.type) return true;  

                        $(this).toggleClass('trSelected');  

                        if (p.singleSelect) $(this).siblings().removeClass('trSelected');  

                        if(p.onRowClick &amp;& typeof(p.onRowClick)=='function'){  

                              var rowObj = _self.getRows();  

                              p.onRowClick(rowObj,e);  

                        }  

                    }).mousedown(function (e) {  

                        if (e.shiftKey) {  

                            $(this).toggleClass('trSelected');  

                            g.multisel = true;  

                            this.focus();  

                            $(g.gDiv).noSelect();  

                            if(isShiftMulti && !p.singleSelect){ //处理shfit多选 add by danielinbiti  

                                  _self.selectRowByIndexArea($(this)[0].rowIndex,shiftSelRowIndex); //处理shfit多选 add by danielinbiti  

                                  shiftSelRowIndex = $(this)[0].rowIndex; //处理shfit多选 add by danielinbiti  

                            }  

                        }  

 

代码多贴了一下上下文,便于往文件中添加。

觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-FlexiGrid支持shift多选全部内容,希望文章能够帮你解决javascript代码实例教程-FlexiGrid支持shift多选所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。