Home > JavaScript > Dodavanje QTip-a na GridPanel ćeliju u ExtJS 4.0

Dodavanje QTip-a na GridPanel ćeliju u ExtJS 4.0

novembar 8th, 2014 Leave a comment Go to comments

Potrebno je da dodate tooltip (quick tip) na ćeliju Grid objekta u ExtJS 4.0? Prilikom definisanja kolone, potrebno je da dodate atribut „rendered“, kome prosledite funkciju.

...
columns [
    ...
    {
      text:"Bookmark", 
      dataIndex:"title", 
      flex:1, 
      renderer:function(value,metaData) 
      {
        metaData.tdAttr = 'data-qtip="' + value + '"';
        return value;
      }
    },
    ...
}
...

Par napomena:

  1. Da bi prikazali tooltip, potrebno je da dodate liniju „Ext.QuickTips.init();“ pre definicanja Grid objekta kojom inicijalizujete prikazivanje tooltip-ova
  2. data-qtip je jedan od četiri atributa za tooltip. Tooltip atributi su:
    • data-qtip – tekst tooltip-a
    • data-qtitle – naslov tooltip-a
    • data-qwidth – širina tolltip-a
    • data-qalign – Definiše poziciju tooltipa u odnosu na original. Primer: „tl-br“ definiše da se gornji-levi ugao tooltip-a prikazuje dole-desno u odnosu na original

Sa malo modififikacije, dobićete fin tooltip izgenerisan za svaku ćeliju u Grid objektu.

Categories: JavaScript Tags: , ,
  1. No comments yet.
  1. No trackbacks yet.