日期:2014-05-16  浏览次数:20365 次

jquery easyui的datagrid中toolbar类似extjs的工具栏靠右浮动

直接上代码:

if(opts.toolbar){
var tb=$("<div class=\"datagrid-toolbar\"></div>").prependTo(_3ae);

var position = $.inArray("->",opts.toolbar);

if(position != -1){
for(var i=0;i<position;i++){
var btn=opts.toolbar[i];
if(btn=="-"){
$("<div class=\"datagrid-btn-separator\"></div>").css("float","left").appendTo(tb);
}else{
var tool=$("<a href=\"javascript:void(0)\"></a>");
tool[0].onclick=eval(btn.handler||function(){
});
tool.css("float","left").appendTo(tb).linkbutton($.extend({},btn,{plain:true}));
}

}

for(var i=position+1;i<opts.toolbar.length;i++){
var btn=opts.toolbar[i];
if(btn=="-"){
$("<div class=\"datagrid-btn-separator\"></div>").css("float","right").appendTo(tb);
}else{
var tool=$("<a href=\"javascript:void(0)\"></a>");
tool[0].onclick=eval(btn.handler||function(){
});
tool.css("float","right").appendTo(tb).linkbutton($.extend({},btn,{plain:true}));
}
}

}else{
for(var i=0;i<opts.toolbar.length;i++){
var btn=opts.toolbar[i];
if(btn=="-"){
$("<div class=\"datagrid-btn-separator\"></div>").css("float","left").appendTo(tb);
}else{
var tool=$("<a href=\"javascript:void(0)\"></a>");
tool[0].onclick=eval(btn.handler||function(){
});
tool.css("float","left").appendTo(tb).linkbutton($.extend({},btn,{plain:true}));
}

}
}

}

在jquery easyui源码中,将此段代码覆盖原来的代码即可。

用法类似分割条'-',只是添加了一个大于号,看就是'->'了。呵呵

上面扩展的是针对的jquery easyui的1.2.2版本。其他的版本可以参考。

/*www.jeestudio.com*/