Tokeninput Autocomplete not working in grails

Question

I think this is more of a jQuery question than that of grails.I am trying to make tokeninput work with a grails form with the following input:

<g:field type="text" name="tags" id="my-text-input"></g:field>

This gets rendered on a web page as:

<input type="text" autocomplete="off" id="token-input-my-text-input" style="outline: none; width: 30px;">

Here is my jQuery code as mentioned in the above link:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="yourfiles/jquery.tokeninput.js"></script>
<link rel="stylesheet" type="text/css" href="yourfiles/token-input.css" />

<script type="text/javascript">
$(document).ready(function () {
    $("#my-text-input").tokenInput("/TaggableDemo/product/tags");
});
</script>

The tags action under ProductController is as:

def tags = {

        render Tag.findAllByTagnameIlike("${params.q}%")*.tagname as JSON
    }

The Tag domain has 3 entries: "Tag1","Tag2","Tag3" When i type "T" in the input element in question, the tags controller does get invoked for autocomplete, and also its returning the correct json(I found this by debugging).But nothing gets displayed in the autocomplete div popup. I wonder whats wrong here. So anyone could help making it work?

Answer 1

Try this:

def tags = {
    def foundTags = Tag.findAllByTagnameIlike("${params.q}%")
    def output = []
    foundTags.each {
        output.add([id: it.id, name: it.tagname]) // assumes Tag has an id field exposed
    }
    render output as JSON
}

Code not tested sorry, so may have bugs.