Hi Scary
Thanks for using Syncfusion products.
We suggest
you to use “
MouseHover” and “
MouseLeave” event to achieve your requirement. We have created the sample from the MVC extension and achieved your requirement in that sample. Please refer the code snippet and sample below.
Code snippet:
<div id="tooltip123" style="position:absolute; height: 20px; width: 160px; background-color: red; display: none;">
<input type="text" value="" id="label1" style="border:none" />
</div>
DiagramProperties model = new DiagramProperties();
model.MouseHover = "mousehover";
model.MouseLeave = "mouseleave";
<script type="text/javascript">
var evX = 0;
var evY = 0;
$(window).mousemove(function (e) {
evX = e.clientX;
evY = e.clientY;
});
function mousehover(args) {
if (args.element.type == "node") {
document.getElementById("tooltip123").style.display = "block";
document.getElementById("tooltip123").style.left = evX + "px";
document.getElementById("tooltip123").style.top = evY + "px";
document.getElementById("label1").value = args.element.addInfo.node2;
}
}
function mouseleave(args) {
if (args.element.type == "node") {
document.getElementById("tooltip123").style.display = "none";
}
}
</script>
Sample:http://www.syncfusion.com/downloads/support/forum/119248/ze/tooltipsample1840856669
Please let me know if any concerns.
Regards,
Shyam G
