Results 1 to 6 of 6

Thread: how can i give link to text in grid column

  1. #1
    Sencha User
    Join Date
    Sep 2010
    Posts
    58
    Vote Rating
    0
      0  

    Smile how can i give link to text in grid column

    i want to give link to some column text, and my text is comming from json file.

  2. #2
    Sencha User
    Join Date
    Dec 2009
    Posts
    425
    Vote Rating
    4
      0  

    Default

    In your ColumnModel
    Code:
    {header: "Link", width: 50, dataIndex: 'col1',
    renderer: function(value, metaData, record, rowIndex, colIndex, store){
         return '<a href = "link.aspx">' + value + '</a>';
    }
    }

  3. #3
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    119
      0  

    Default

    Normally you don't want to navigate to a new page, so I recommend:
    Code:
    {header: "Link", width: 50, dataIndex: 'col1', renderer: function(val, meta, rec) {
      meta.css += 'x-link';
      return val;
    }}
    with:
    Code:
    .x-link {
      color: blue;
      text-decoration: underline;
      cursor: pointer;
    }
    and
    Code:
    grid.on('cellclick', function(grid, row, col, e){
      var field = grid.getColumnModel().getDataIndex(col);
      if (field == 'col1') {
        var record = grid.getStore().getAt(row);
        // do stuff
      }
    });

  4. #4
    Sencha User
    Join Date
    Sep 2010
    Posts
    58
    Vote Rating
    0
      0  

    Smile yes

    Thank you very much

  5. #5
    Sencha User
    Join Date
    Sep 2010
    Posts
    58
    Vote Rating
    0
      0  

    Default

    i also need to add tooltip to that link in the grid cell, how can i add tooltip, please help

  6. #6
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    119
      0  

    Default

    Code:
    {header: "Link", width: 50, dataIndex: 'col1', renderer: function(val, meta, rec) {
      meta.css += 'x-link';
      meta.attr += 'ext:qtip="' + Ext.util.Format.htmlEncode('Tip: ' + rec.get('otherField')) + '"';
      return val;
    }}
    and on the first line of your Ext.onReady call:
    Code:
    Ext.QuickTips.init();

Similar Threads

  1. How to give a Column Seperator in a Grid
    By shajeerkt in forum Ext GWT: Discussion
    Replies: 1
    Last Post: 29 Jan 2010, 10:48 AM
  2. How to give a href link to column or cell data in a EXT grid?
    By rajesh_kar123 in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 11 May 2009, 7:22 AM
  3. How to add link in a grid column
    By pankaj in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 7 Jan 2008, 5:46 AM
  4. give an alert when i click on column header
    By sreenija in forum Ext 1.x: Help & Discussion
    Replies: 0
    Last Post: 23 Dec 2007, 8:16 PM
  5. HTML link in a Grid column
    By randy in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 21 Jan 2007, 7:28 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •