Ted Nyberg
Ted Nyberg

Reputation: 7411

Add hyperlink with click event to Dojo grid

My question is similar to Implementing a hyperlink within a dojo datagrid, and I'm successfully able to add markup for hyperlinks to a Dojo grid using a formatter.

However, I need to wire up a click events on these hyperlinks, to trigger a function within the Dijit containing the grid.

I have a formatter like the following:

var createEditLinks = function (data) {
   return '<a class="my-css-class" href="#" onclick="myFunctionInsideTheDijit()">' + data.title + '</a>'
}

While this works (I do get the markup inside the grid cell), the myFunctionInsideTheDijit function is unavailable (unless I would declare it on the global scope).

I've looked a little at dom-construct, but I just can't figure out how to add a hyperlink that invokes a Dijit function when clicked.

Any help is greatly appreciated! Thanks!

Upvotes: 1

Views: 1401

Answers (2)

Ted Nyberg
Ted Nyberg

Reputation: 7411

I resorted to using dojo/behavior to make it work:

// Code inside Dijit's startup function
var that = this;

behavior.add({
    "a.my-css-class": {
        onclick: function (e) {
            e.preventDefault();

            that.myFunctionInsideTheDijit();
        }
    }
});

behavior.apply();

Not sure if there's a more elegant way of doing this? :)

Upvotes: 0

Ken Franqueiro
Ken Franqueiro

Reputation: 10559

A more modern way to do this than with dojo.behavior would be to use on and event delegation. dgrid instances already expose their own on function to make this slightly easier:

grid.on('a.my-css-class:click', function (event) {
    ...
});

Upvotes: 2

Related Questions