脚本宝典收集整理的这篇文章主要介绍了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 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 && 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,请注明来意。