Link attributes not rendered for span elements

[crlane]

I'm having trouble getting the links to show up when jQCloud builds the html objects. Everything else shows up correctly. According to my Chrome developer tools, the link attributes are set properly in the corresponding javascript objects, but they are not rendered as <a href= elements when the page loads. See below:

javascript file with word array

html elements generated by jQCloud

javascript objects for each word in array

EDIT: Even though in the screen shot it shows relative link, I have tried using absolute URLs. Additionally, I have tried single/double quotes, removing all styling and parent divs from the page, everything I can think of. For some reason, the link attribute is not recognized, either in string or object form.

[lucaong]

This is strange indeed. Are you using a recent version of jQCloud? Because if you provide a string link attribute, jQCloud should transform it into an object, so it should not be a string in the console:

https://github.com/lucaong/jQCloud/blob/master/jqcloud/jqcloud-1.0.4.js#L115

So this is what expected in the console (link is an object with a href property):

Old pre 1.0 versions of jQCloud had a url attribute instead of link, and that is the only thing that comes to my mind that could cause this issue.

If you can confirm that you are using a recent version (>1.0), then I would ask you if you can provide me with the source code of the word list definition, so I can investigate further.

Thanks

[crlane]

Yes, I am using jQCloud 1.0.3. Here is the definition of the word list. This javascript is generated (once) by my python blog engine and then saved to an external .js file. That file is then included on the html page in the same manner as the other javascript. Might it be something to do with the fact that the script is loaded from an external file? Also, my knowledge of javascript is not the best, so maybe I just have formed some part of the js incorrectly? Thanks for taking a look.

var word_list = [
    {text: "osx", weight: 2, link: "/blog/tags/osx/"},
    {text: "programming", weight: 3, link: "/blog/tags/programming/"},
    {text: "google", weight: 1, link: "/blog/tags/google/"},
    {text: "scripts", weight: 2, link: "/blog/tags/scripts/"},
    {text: "vim", weight: 1, link: "/blog/tags/vim/"},
    {text: "tex", weight: 1, link: "/blog/tags/tex/"},
    {text: "ap", weight: 1, link: "/blog/tags/ap/"},
    {text: "lion", weight: 1, link: "/blog/tags/lion/"},
    {text: "books", weight: 2, link: "/blog/tags/books/"},
    {text: "learning", weight: 1, link: "/blog/tags/learning/"},
    {text: "regex", weight: 1, link: "/blog/tags/regex/"},
    {text: "publishing", weight: 1, link: "/blog/tags/publishing/"},
    {text: "flask", weight: 1, link: "/blog/tags/flask/"},
    {text: "perl", weight: 1, link: "/blog/tags/perl/"},
    {text: "speech", weight: 1, link: "/blog/tags/speech/"},
    {text: "computer science", weight: 1, link: "/blog/tags/computer%20science/"},
    {text: "apcs", weight: 1, link: "/blog/tags/apcs/"},
    {text: "reading", weight: 1, link: "/blog/tags/reading/"},
    {text: "opensource", weight: 1, link: "/blog/tags/opensource/"},
    {text: "gaming", weight: 1, link: "/blog/tags/gaming/"},
    {text: "python", weight: 2, link: "/blog/tags/python/"},
    {text: "javascript", weight: 1, link: "/blog/tags/javascript/"},
    {text: "geekery", weight: 2, link: "/blog/tags/geekery/"},
    {text: "nintendo", weight: 1, link: "/blog/tags/nintendo/"},
    {text: "latex", weight: 2, link: "/blog/tags/latex/"},
    {text: "github", weight: 1, link: "/blog/tags/github/"},
    {text: "reviews", weight: 2, link: "/blog/tags/reviews/"},
    {text: "algorithms", weight: 1, link: "/blog/tags/algorithms/"},
    {text: "exams", weight: 1, link: "/blog/tags/exams/"},
    {text: "teaching", weight: 1, link: "/blog/tags/teaching/"}
];
$(function() {
$('#wordcloud').jQCloud(word_list);
});

[lucaong]

It's so strange... I really cannot reproduce the issue...

Here is my test with jQCloud v1.0.0 and a copy/paste of your code. The links work just fine there.

http://jsfiddle.net/BE8Xz/

One thing I observe though is that in your screenshots also the title attribute is set, which shouldn't be the case with version v1.0.x, but was the behavior pre v1.0. This really leads me to think that you may be using a version older than v1.0 In this case, you can upgrade to latest version, or simply use the v0.x.y syntax which needs url instead of link:

var word_list = [
  { text: "Foo", weight: 3, url: "/my/url"},
  // ...
];

Let me know if t works. You can find all jQCloud versions as tags in the GitHub repo.

[crlane]

I was definitely using 1.0.3 previously. However, I upgraded to 1.0.4 and it is now working correctly. No idea what was going on, but it also could have been a problem with my jquery configuration. I'll try a few more things to see if I can isolate/reproduce the issue. Thanks for the help.

[lucaong]

You are welcome. Good to know it was solved :)