How to place clickable image next to node text & on click of it capture some value from user.
Hello and welcome to the community!
If you want to use the existing inbuilt functionality, you could reference the existing online sample and documentation regarding how to add custom images to the igTree nodes prior to the text of each node. https://www.igniteui.com/help/igtree-configure-node-images
What is more, if you require to add the images at the end of each node’s text, you could use templating for this.Samples and online documentation how to achieve this could be found at:Setting up Node Template in the jQuery igTree – notice a downloadable code sample is included.API reference for the related option in use - nodeContentTemplate Additional blog article describing “How to use templates to style the different nodes of the Ignite UI Tree control” could be found here
In general, binding click event handler could be done using something similar to following:$('img').bind('click', function (evt) { alert(evt.target); }); http://api.jquery.com/click/ http://api.jquery.com/bind/
Or just use the existing igTree API and handle nodeClick event, to achieve similar functionality when clicking the node, instead the actual image at the end of the node.
Hi Ivaylo ,
Thanks for Response. I was able to add image & make it clickable .
but when user hovers on the node , whole node is getting highlighted(Text & image after text) , which confuses end user whether they clicked on note text or node image. is there way to take off hover & selection option for node text & maintain both for image after the text.