02-03-2015 02:13 PM
Hi,
I want to display customize tooltip on link.
I followed the same code as posted on http://xq.cisco.com/next/NeXtSite/demos.html#Tooltip/link
However, it is not working in my case.
Below is code snipped:
nx.define('MyLinkTooltip', nx.ui.Component, {
properties: {
link: {},
topology: {}
},
view: {
content: [{
tag: 'p',
content: [{
tag: 'label',
content: 'Source:'
}, {
tag: 'span',
content: '{#link.model.source}'
}]
}, {
tag: 'p',
content: [{
tag: 'label',
content: 'Target:'
}, {
tag: 'span',
content: '{#link.model.target}'
}]
}, {
tag: 'p',
content: [{
tag: 'label',
content: 'Status:'
}, {
tag: 'span',
content: '{#link.model.status}'
}]
}]
}
});
In porps parameter put the following code:
tooltipManagerConfig: {
nodeTooltipContentClass: 'MyNodeTooltip',
linkTooltipContentClass: 'MyLinkTooltip'
}
Please do let me know,where I want to do the changes to implement the link tooltip.
Regards,
Sachin Samel
02-03-2015 02:20 PM
This two syntax cause error.
content: '{#link.model.source}'
Change to :
content: '{#link.model.source.id}'
Same as target
content: '{#link.model.target}'
chang to:
content: '{#link.model.target.id}'
02-05-2015 01:57 AM
Yes Abu. That solved my problem.
Another thing I noticed that, for boolean value false, it is not showing me any data. Can we handle it in a function which will return boolean values in string format?
e.g. content: function(){
//code to convert boolean to string format.
return str;
}
I tried like above code, but it was showing me the entire function definition in the popover.
Thanks,
Sachin
02-05-2015 06:27 PM
you can use converter to process data.
define a converter
var myConverter = {
convert: function(value) {
return value ? 'true' : 'false'
},
convertBack: function(value) {
return value == 'true';
}
}
and use it
content: '{#link.model.status,converter=myConverter}'
02-06-2015 03:52 AM
Thanks Abu.
Can you please explain what convertBack function does?
Regards,
Sachin
02-10-2015 12:19 AM
Hi Abu,
I tried the converter function but it is not working.
It is not returning me any value if the value is false.
I tried to debug the converter function calling by putting console.log(value), but nothing is displayed in console.
Regards,
Sachin
02-12-2015 04:09 PM
Hi Sachin,
this is converter's syntax : 'key:{model,converter=converterName}' , so if you can paste you code here, i can help on debug
02-12-2015 04:06 PM
Hi Sachin,
We use two-way binding for View and Model, so 'convert' mean from Model-> View and 'convertBack' means from View -> Model
Discover and save your favorite ideas. Come back to expert answers, step-by-step guides, recent topics, and more.
New here? Get started with these tips. How to use Community New member guide