ParamQuery grid support forum

General Category => Help for ParamQuery Grid (free version) => Topic started by: IBoadoC on May 19, 2016, 08:21:17 pm

Title: How to use a custom icon for a toolbar item (Button)
Post by: IBoadoC on May 19, 2016, 08:21:17 pm

Hello,

I am having trouble trying to use a custom icon in a button inside a toolbar. In the API documentation it's noted as posible but I can't find a way to make it work.

the ítem I'm inserting in the toolbar is the following:

addItemToolbar(loGridOpciones['toolbar'],'export','button','<bean:message key="CTAS.BTN_EXPORT_EXCEL" />',[{click:exportCuentas}],{'icon':'<html:rewrite page="/img/'customImage.gif'"/>',attr:'title="Export this to excel"'});

But i've only managed to get it to default to a JQueryUI icon (^ this one).

Can someone give me some advice in what am I doing wrong?

Thanks in advance!

Title: Re: How to use a custom icon for a toolbar item (Button)
Post by: IBoadoC on May 23, 2016, 12:12:37 pm

If there is anything I could do to help clarify my question or something that might be not well worded please tell me, I would be very glad if someone could help me with this.

Thanks in advance.

Edit: I just realized that the code snippet is not really very informative as it contains a custom function. I think it might be better if a mod could delete the post, so I can open a new one with a better explanation of what I need and where. I'm fairly new to the code and i've yet to get a good grasp of the whole project.

Thanks in advance.

Title: Re: How to use a custom icon for a toolbar item (Button)
Post by: paramvir on May 23, 2016, 04:15:56 pm

Custom icon can be added in a toolbar item such as a button with help of css background attribute as

in js

Code: [Select]

{
  type: 'button',
  icon: 'pq', //any css class.
  ....

and in css

Code: [Select]

.ui-icon.pq{
background: url( 'pqgrid.gif' ); /* any 16 * 16 image */
}


Title: Re: How to use a custom icon for a toolbar item (Button)
Post by: IBoadoC on May 23, 2016, 07:20:11 pm

Your solution fixed the issue. Thank you very much!