Print Page - tooltip problem in panel

Title: tooltip problem in panel
Post by: crosemffet on April 03, 2016, 04:28:48 AM

hello everybody and thanks for your support,
I'm trying to add programatically tooltip text to a icon on panel, but is not working
my code is:
$('#read_window_text').panel({
      tools:[{
         iconCls:'icon-add easyui-tooltip',title:'my tooltip title', handler:function(){alert('add')}
      },{
also try replacing title attribute with content (content:'my tooltip title')
but the tooltip doesn't show.
any suggestions..?
thanks in advance,

Title: Re: tooltip problem in panel
Post by: stworthy on April 03, 2016, 08:17:32 AM

Please refer to the code below:

Code:

<div id="pp" class="easyui-panel" title="Custom Panel Tools" style="width:700px;height:200px;" data-options="closable:true,tools:'#tt'">
</div>
<div id="tt">
	<a href="javascript:void(0)" class="icon-add easyui-tooltip" title="my tooltip title" onclick="javascript:alert('add')"></a>
</div>

Title: Re: tooltip problem in panel
Post by: crosemffet on April 03, 2016, 11:54:10 AM

stworthy, thanks for your reply.
i know your solution works, the problem is I'm creating the Panel programatically,
so, in the general panel example, how can I add tooltip to the tools?
$('#p').panel({
width:500,
height:150,
title:'My Panel',
tools:[{
iconCls:'icon-add',
handler:function(){alert('new')}
},{
iconCls:'icon-save',
handler:function(){alert('save')}
}]
});
any idea...? thanks in advance,

Title: Re: tooltip problem in panel
Post by: stworthy on April 04, 2016, 07:59:28 AM

The 'tools' property value can be an array or a jQuery object. You can create this 'tools' object programatically.

Code:

$('#pp').panel({
    width:500,
    height:150,
    title:'My Panel',
    tools: function(){
    	var t = $('<div></div>');
	    $.map([{
	        iconCls:'icon-add',
	        text: 'add tooltip',
	        handler:function(){alert('new')}
	    },{
	        iconCls:'icon-save',
	        text: 'save tooltip',
	        handler:function(){alert('save')}
	    }], function(tool){
	    	var a = $('<a href="javascript:;"></a>').appendTo(t);
	    	a.addClass(tool.iconCls).tooltip({
	    		content:tool.text
	    	}).bind('click', tool.handler);
	    });
    	return t;
    }()
});

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: crosemffet on April 03, 2016, 04:28:48 AM