Click on font awesome icon and trigger event

Suite and Optimus Suite 5
#1

I have added a font awesome icon in my custom column(ropath). Now I want to add a click event on the icon and display the row data in form of icons. I have used following code to add the icon and the event:

function eXcell_ropath(cell)
{
if (cell)
{
this.cell = cell;
this.grid = this.cell.parentNode.grid;
}

this.getValue = function ()
{
    return this.cell.innerHTML;
};

this.setValue = function (val)
{
    if (val === '')
    {
        this.setCValue('');
        return;
    }

    var template = $("<div><i style=\"padding-right: 4px;\"></i><span></span></div>");
    template.find("i").addClass("fa fa-plus-circle");
   template.find("i").css("color", "limegreen");
    template.find("span").html(val);

    // Custom function to create a DHTMLX window and disply icons
$('.fa.fa-plus-circle').click(function(){CreateDiagram(val);});
	
    this.setCValue(template.html());
};

}

eXcell_ropath.prototype = new eXcell;

Issue: As of now if I click on the first row icon, it triggers the rest of the events too. Because all the click events are being added to the same class. I was thinking to add these to the row IDs. Is it possible to get row ids in the custom column function? Is there another way DHTMLX can suggest?

Please Help.

image
image1904×527 11.2 KB

#2

Please Advise… Any help would be appreciated… :slight_smile:

#3

I apologize for the delay
If you need to get the id of the current rendering row you may get int right in the setValue function:

  this.setValue=function(val){
        var row_id=this.cell.parentNode.idd;     // gets the id of the related row
//...
#4

Thanks a lot… You are the best :slight_smile: