1. #1
    Sencha Premium Member
    Join Date
    Oct 2011
    Posts
    8
    Vote Rating
    0
    ssswdon is on a distinguished road

      0  

    Default Unanswered: 2 links in cell of grid

    Unanswered: 2 links in cell of grid


    I have a requirement to provide 2 links in a grid cell. I can't figure out how to provide a click listener for these links. I currently have them wired to global functions but need access to the datastores to save state and extra params.

    I have a click listener but it seems to only be at the cell level. I need to provide different actions for each link.

    Any suggestions?

  2. #2
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,625
    Vote Rating
    331
    Answers
    550
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    Interesting.

    One way to do this would be to put a listener higher up. For example, you might register an itemclick listener on the grid's view. In the handler you could then build logic that inspects the event object to see whether one of your links was clicked.

    For example, you could put different CSS classes on each link to differentiate them and then use something like this in your handler:

    Code:
    var link1 = ev.getTarget('a.link1');
    
    if (link1) {
        ...
    }
    Accessing the record is easy as it's already passed to the itemclick handler.

  3. #3
    Sencha Premium Member
    Join Date
    Oct 2011
    Posts
    8
    Vote Rating
    0
    ssswdon is on a distinguished road

      0  

    Default


    Thanks, added to viewConfig.

    listeners: {
    itemclick: function( view, record, item, index, event, eOpts ) {
    var data = record.data;
    var className = event.getTarget().className;
    processClickEvent(className, data);
    }
    }

  4. #4
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,625
    Vote Rating
    331
    Answers
    550
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    Please use CODE tags when posting code (# button on the editor toolbar).

    I strongly advise that you avoid accessing record.data directly. It's a breach of encapsulation. Where possible try to use the get() method on the record. In your case I see no reason not to pass the whole record to your processClickEvent function (though not sure why you need a global function like that).

    There are a couple of potential pitfalls around this line:

    Code:
    var className = event.getTarget().className;
    Firstly, grabbing className like that leaves you vulnerable if you later want to add other classes, e.g. for styling purposes. Secondly, using getTarget() without an argument will grab the wrong element if you add tags within your anchors (try it, add in a span). This may not be a problem right now but it will fail if you change your markup in future. Note how my original suggestion avoids these two problems.

Thread Participants: 1