jQCloud
jQCloud copied to clipboard
afterCloudRender not recognizing the spans
In a tool I'm developing we need to be able to trigger some actions for each word in the generated cloud.
When using the afterCloudRender the correct callback is triggered but none of the words are found.
var _MakeWordsClickable = function () {
console.log('callback start');
console.log($('div#wordcloud span').size());
$('div#wordcloud span').each(function () {
$(this).click(function () {
console.log($(this).text());
});
});
console.log('callback end');
}
The console shows 'callback start' and 'callback end' but the size of the spans is 0.
When I execute the code with a timeout of 200 miliseconds everything works.
$("#wordcloud").jQCloud(objCloud, { afterCloudRender: setTimeout('_MakeWordsClickable()',200) });
I tried to circumvent the timeout by using the afterWordRender at each word, but the same problems exists.
So in essence, jQCloud is not waiting until the cloud is completely rendered.
Thanks for looking into this.
same problem here, is there a better fix than using timeout? thanks, chris
Hi Chris,
In _MakeWordsClickable()
I used the jQuery .on() command which is like a live bind, so as each word is added to the cloud it automatically gets that code.
For example:
var _MakeWordsClickable = function(){
$('div#wordcloud').on('click', 'span', function(){
// do something
});
}
This way there is no need for a timeout, which would be subject to the amount of words loaded.
Hope this helps.
Thanks, Dieter