1.修改默认的json格式为key:value
修改前
rows: [{id:'ZW',cell:['ZW','ZIMBABWE','Zimbabwe','ZWE','716']},{id:'ZW',cell:['ZW','ZIMBABWE','Zimbabwe','ZWE','716']}]
修改后
rows: [{id:'1',name:'Anson',sex:'男',email:'chents@gpcsoft',qq:'75526201'},{id:'2',name:'Anson',sex:'男',email:'chents@gpcsoft',qq:'75526201'}]
源码修改说明
找到 if (p.dataType=='json')将其后的大括号{}内容改为:
$.each ( data.rows, function(i,row) { var tr = document.createElement('tr'); if (i % 2 && p.striped) tr.className = 'erow';
if (row.id) tr.id = 'row' + row.id; //by anson QQ:75526201 chents@gpcsoft.com 转载请保留 var tdVal = []; //给每行添加id if (p.rowId){ $.each( data.rows[i], function(x,y){ if(p.rowId==x){tr.setAttribute('id',y); }}) }
if (p.colModel){ for (j=0;j<p.colModel.length;j++){ var cm = p.colModel[j]; //取列名 var seleceName = cm.name; //过滤key $.each( data.rows[i], function(x,y){ if(seleceName==x){tdVal.push(y)} }) } } //add cell $('thead tr:first th',g.hDiv).each ( function () { var td = document.createElement('td'); var idx = $(this).attr('axis').substr(3); td.align = this.align; td.innerHTML = tdVal[idx]; //td.innerHTML = row.cell[idx]; $(tr).append(td); td = null; } ); if ($('thead',this.gDiv).length<1) //handle if grid has no headers {for (idx=0;idx<cell.length;idx++) { var td = document.createElement('td'); //td.innerHTML = row.cell[idx]; td.innerHTML = tdVal[idx]; $(tr).append(td); td = null; } }
$(tbody).append(tr); tr = null; } );2.加入checkbox
只要设置checkbox:true即可在前面显示多选框
源码修改说明
a.找到 $('div:eq('+n+')',g.cDrag).css({'left':cdpos+'px'}).show();
替换为:
//添加多选框 if (p.checkbox) { $('div:eq('+n+')',g.cDrag).css({'left':cdpos+22+'px'}).show(); } else{ $('div:eq('+n+')',g.cDrag).css({'left':cdpos+'px'}).show(); }
b.找到//add cell
前面插入:
//添加多选框 if (p.checkbox) {
var cth = $('<th/>');
var cthch = $('<input type="checkbox" value="' + $(tr).attr('id') +'"/>'); var objTr = $(tr); cthch.addClass("noborder").click(function(){ if(this.checked){objTr.addClass('trSelected'); } else{ objTr.removeClass('trSelected'); } })
cth.addClass("cth").attr({ width: "22"}).append(cthch);$(tr).prepend(cth);
}
c.找到$(this).toggleClass('trSelected');
后面插入:
//添加多选框 if(p.checkbox){ if($(this).hasClass('trSelected')){ $(this).find('input')[0].checked=true; } else{ $(this).find('input')[0].checked=false } }
d.找到if ($('th',g.hDiv).length)
在其后的{}大括号中加入
//添加多选框 if (p.checkbox) { $('tr',g.hDiv).each( function(){
var cth = $('<td/>');
var cthch = $('<input type="checkbox"/>'); cthch.click(function(){ if(this.checked){ $('tbody tr',g.bDiv).each(function(){ $(this).addClass('trSelected').find('input')[0].checked=true; }) } else{ $('tbody tr',g.bDiv).each(function(){ $(this).removeClass('trSelected').find('input')[0].checked=false; }) } }) cth.addClass("cth").attr({ width: "22" }).append(cthch); $(this).prepend(cth); }) };e.找到p = $.extend({
添加一条默认设置
checkbox:false,//是否要多选框