Print Page - Change panel tools dynamically?

General Category => EasyUI for jQuery => Topic started by: tomb on August 24, 2014, 07:51:49 PM

Title: Change panel tools dynamically?
Post by: tomb on August 24, 2014, 07:51:49 PM

How can I change a panel's tool dynamically after the panel was created? Is there a method I can call that rebuilds the tools after I change the tools property?

Title: Re: Change panel tools dynamically?
Post by: jarry on August 24, 2014, 09:04:22 PM

It is easy to extend a method to set the panel tools.

Code:

$.extend($.fn.panel.methods, {
	setTools:function(jq, param){
		return jq.each(function(){
			var opts = $(this).panel('options');
			opts.tools = param;
			var header = $(this).panel('header');
			var tool = header.find('.panel-tool');
			tool.find(':not(.panel-tool-close,.panel-tool-collapse,.panel-tool-max,.paenl-tool-min)').remove();
			for(var i=opts.tools.length-1; i>=0; i--){
				var t = $('<a href="javascript:void(0)"></a>').addClass(opts.tools[i].iconCls).prependTo(tool);
				if (opts.tools[i].handler){
					t.bind('click', eval(opts.tools[i].handler));
				}
			}
		});
	}
})

Usage example:

Code:

$('#p').panel('setTools', [{
	iconCls:'icon-save',
	handler:function(){alert('save')}
},{
	iconCls:'icon-cancel',
	handler:function(){alert('cancel')}
}])

Title: Re: Change panel tools dynamically?
Post by: tomb on August 25, 2014, 07:23:13 AM

Awesome! This framework is just so cool! I assume I'd have to do something similar for modifying a dialog's buttons dynamically, as well. Seems like some good new features for the next version.

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: tomb on August 24, 2014, 07:51:49 PM