How we can get the ID of selected tags using Jquery tagit?

Question

I have a input tag field ,and I want to get the ID of the selected tages So I have try http://jsfiddle.net/u8zj5/19/ But my problem I want to get the id not label or value to pass into `id="show"` but I failed. ``` show ID here jQuery(document).ready(function(){ var availableTags = [{"id":"144","label":"Allicelabel","value":"Allice value"}]; jQuery("input#field1").each(function(){ var target = jQuery(this); var currenttags = target.val(); target.hide() .after("

"+currenttags+"

"); var instance = target.next(); instance.tagit({ tagSource:availableTags, tagsChanged:function () { var tags = instance.tagit('tags'); var tagString = []; for (var i in tags){ tagString.push(tags[i].value); } $("#show").html(tagString.join(',')); }, sortable:true, triggerKeys: ['enter', 'comma', 'tab'] }); }); ``` }); Anyone here that used jQuery Tagit (Demo Page) Could help me to solve this

Accepted Answer

I had the same problem and I what did was modify tag-it.js. When you call the function select you need to send the `ID` through the function `_addTag`

```
self._addTag(ui.item.label, ui.item.value, ui.item.id);
```

Then youu just need to get the id:

```
_addTag: function(label, value, id) {
    ...
    this._addSelect(label, value, id);
    ...
}
```

And here append the `ID` on a hidden Select

```
_addSelect: function(label, value, id) {
        var opt = $('<option>').attr({
            'selected':'selected',
            'value':id
        }).text(label);
        this.select.append(opt);
```

With this you can have, one label for the autocomplete list, one value to show in the tag, and the `ID` on a hidden select.

How we can get the ID of selected tags using Jquery tagit?

Solution

Problem