Search code examples
javascriptjqueryhtmljquery-tokeninput

Plugging in a jQuery plugin

I'm trying to use the jquery tokeninput plugin, the demos work fine however when I try to implement it I'm hitting a brick wall. Chrome chucks this at me:

Uncaught TypeError: Object [object Object] has no method 'tokenInput'

Below is an excerpt from my <head>, chrome's resource browser shows both jQuery and jquery.tokeninput are loaded fine. No URL issues.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="/media/js/jquery.tokeninput.js"></script>

<script type="text/javascript">
$(document).ready(function () {
    $("#token").tokenInput("/members/api/members/tokeninput_members/?format=json");
});
</script>

And showing that tokeninput has loaded:

Chrome dev tools, showing jquery.tokeninput has indeed loaded

Solution

  • Right, bare-bones page worked fine. After digging a while longer I found this buried at the base of the page:

    <script src="http://code.jquery.com/jquery.js"></script>

    It seems having multiple versions of jQuery loaded is not a good thing to do.