Author Topic: How to use a custom icon for a toolbar item (Button)  (Read 4713 times)

IBoadoC

  • Newbie
  • *
  • Posts: 3
    • View Profile
How to use a custom icon for a toolbar item (Button)
« 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!

IBoadoC

  • Newbie
  • *
  • Posts: 3
    • View Profile
Re: How to use a custom icon for a toolbar item (Button)
« Reply #1 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.
« Last Edit: May 23, 2016, 01:40:57 pm by IBoadoC »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6314
    • View Profile
Re: How to use a custom icon for a toolbar item (Button)
« Reply #2 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 */
}

IBoadoC

  • Newbie
  • *
  • Posts: 3
    • View Profile
Re: How to use a custom icon for a toolbar item (Button)
« Reply #3 on: May 23, 2016, 07:20:11 pm »
Your solution fixed the issue. Thank you very much!