ucanpijama
New Member
I have a JavaScript plugin which plots a chart (row-wise items shown) as per a json array passed as input.
There is a certain functionality inside the chart i.e. when a row item is clicked, I trigger an an event and expose a callback from the plugin for the plugin for the user to pass the html source.\[code\]events.trigger(this, "rowselect", { index: itemIndex, callback: function (changedItem) { changedItemSource = changedItem; } });\[/code\]When the user of this plugin listens to the event, he can pass the new source to clicked row item. Here's how:\[code\]events.addListener(projChart, 'rowselect', function (properties) { var Properties = myInputJson[properties.index]; var newSrc = 'http://stackoverflow.com/questions/15519195/<div id="btnSettings" class="tl-div-btnSettings"></div>'; properties.callback(newSrc); });\[/code\]When the new source (\[code\]var newSrc\[/code\] above) is passed, internally in the plugin, it is added as \[code\].innerHtml\[/code\] of that particular row item.
Currently, I already have event listener attached for mouse down on the row items. (first click expand, second click collapse). When a particular row is clicked, I also get the index of the item clicked as shown above.
I want to provide the option of a click event on that button just passed through new source ( and on click, I should also have access to the index of item clicked). How do I do that outside my plugin, because the user may pass any kind of source and I can't keep a track of event target inside the plugin? Also, how do I in that case get hold of the index of the row in which the button was?
There is a certain functionality inside the chart i.e. when a row item is clicked, I trigger an an event and expose a callback from the plugin for the plugin for the user to pass the html source.\[code\]events.trigger(this, "rowselect", { index: itemIndex, callback: function (changedItem) { changedItemSource = changedItem; } });\[/code\]When the user of this plugin listens to the event, he can pass the new source to clicked row item. Here's how:\[code\]events.addListener(projChart, 'rowselect', function (properties) { var Properties = myInputJson[properties.index]; var newSrc = 'http://stackoverflow.com/questions/15519195/<div id="btnSettings" class="tl-div-btnSettings"></div>'; properties.callback(newSrc); });\[/code\]When the new source (\[code\]var newSrc\[/code\] above) is passed, internally in the plugin, it is added as \[code\].innerHtml\[/code\] of that particular row item.
Currently, I already have event listener attached for mouse down on the row items. (first click expand, second click collapse). When a particular row is clicked, I also get the index of the item clicked as shown above.
I want to provide the option of a click event on that button just passed through new source ( and on click, I should also have access to the index of item clicked). How do I do that outside my plugin, because the user may pass any kind of source and I can't keep a track of event target inside the plugin? Also, how do I in that case get hold of the index of the row in which the button was?