Hi folks,

how can I display an iconic button in grid based on query?

I have a query which returns with each row information about it locking - Y or N. If grid I don't want to display Y resp. N values, but icons related to this value.

This should be simple, but can't quickly find it right now.

Many thanks, Tomas

asked 23 Sep '13, 02:39

Tomeo's gravatar image

Tomeo
162147
accept rate: 3%


Hi Tomas,

This is the way i do it now:

Create a simple table to store your icons, lets say a table called ICON_BLOBS with two columns, ICON_NAME (varchar) and ICON_BLOB (blob). Upload your icons into this table.

In your datasource, query the icon blob for the icon you want to use for that row. Then in the grid, create a columns like this, referring to the blob column in your datasource:

<column headerLabel="Uzamknuté" width="20">
  <image column="DATASOURCE_ICON_BLOB_COLUMN" />
</column>

You have to set the grid row height on the grid, because otherwise the row will be too high. So like:

 <grid rowHeight="20" ...

Hope this helps.

Best, Michiel

link

answered 31 Oct '13, 11:21

Michiel%20A's gravatar image

Michiel A
5161544
accept rate: 13%

Hi Michiel,

many thanks for your suggestion. I think it's an option which will work.

Kindest regards, Tomas

(01 Nov '13, 10:53) Tomeo

Hi Tomas,

No problem, glad i could help. By the way: here is the tutorial for uploading a blob image to the table via Formpider API's:

http://theformspider.com/learningcenter/tutorial-15-how-to-upload-a-file/

Also note that i found that with a grid row width and height of 20px you have room for a 12x12px icon without Formspider scaling the image.. The image component on a form with width and height 20px will fit a 16x16px image.

You can solve it using CSS. Add a CSS file to your application and put this the CSS snippet below in it. It will reduce the padding, so a 16x16px icon will fit perfectly without scaling in a grid row:

.bdf-grid .bdf-image img { padding: 1px !important; }

Good luck, Michiel

(01 Nov '13, 12:01) Michiel A

Hi Tomas,

If you want the icon to be clicked then I am afraid there is no way to do that.

But if you just want to show a small picture in each row, you can use the image component in a grid column and bind it to a datasource column of the grid. This column should store a URL that points to the image.

link

answered 24 Sep '13, 12:42

Yalim's gravatar image

Yalim ♦♦
2.8k5
accept rate: 22%

Hi Yalim,

thanks for the reply. At this stage, I just need an image (icon) without action to be displayed.

Here is a sample of my query:

select decode(uzamknuty,'Y','/resources/icons/lock.png','/resources/icons/lock_open.png') locked
from my_table

In grid definition I have added a column:

  <column headerLabel="Uzamknuté" width="20" >
    <image url="LOCKED"  />
  </column>

Unfortunately it does not work, so I'm not sure whether I have understood you correctly. Thanks, Tomas

link

answered 25 Sep '13, 17:17

Tomeo's gravatar image

Tomeo
162147
accept rate: 3%

Hello folks,

could anybody advice what is set wrong?

Thanks, Tomas

link

answered 09 Oct '13, 03:19

Tomeo's gravatar image

Tomeo
162147
accept rate: 3%

Hi Tomas,

I did not test it, but i think you should reference the column holding the image url like this:

    <column headerLabel="Uzamknuté" width="20">
      <image column="LOCKED" />
    </column>

I think that if you put url="LOCKED" then it expects "LOCKED" to be the url, and it won't be able to find an image. (you could check the generated html to see what is in the url attribute there)

Hope it helps.

Best, Michiel

link

answered 10 Oct '13, 15:51

Michiel%20A's gravatar image

Michiel A
5161544
accept rate: 13%

I tested this, because i now have a similar requirement, but this also does not work. You will receive an error in the XML Editor:

Image component must be bound to BLOB column

(31 Oct '13, 11:00) Michiel A
Your answer
toggle preview

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Markdown Basics

  • *italic* or _italic_
  • **bold** or __bold__
  • link:[text](http://url.com/ "title")
  • image?![alt text](/path/img.jpg "title")
  • numbered list: 1. Foo 2. Bar
  • to add a line break simply add two spaces to where you would like the new line to be.
  • basic HTML tags are also supported

Tags:

×85
×10
×2
×1

Asked: 23 Sep '13, 02:39

Seen: 1,591 times

Last updated: 01 Nov '13, 12:04


© Copyright Gerger 2017