Bootstrap tagsinput add tag with id and value

Question

I am using Bootstrap Tags Input

I am trying to add tags dynamically.

$('.div-tag').tagsinput('add', 'vino');

The above code works fine, but when I try the following code:

$('.div-tag').tagsinput('add', { id: 1, text: 'some tag' });

I get the error:

Uncaught Can't add objects when itemValue option is not set

Please help me to add tag with id and value.

Answer 1

initialize tags input like

 $('.div-tag').tagsinput({
      allowDuplicates: false,
        itemValue: 'id',  // this will be used to set id of tag
        itemText: 'label' // this will be used to set text of tag
    });

To add dynamic tag

$('.div-tag').tagsinput('add', { id: 'tag id', label: 'tag lable' });

That's it;

Answer 2

I spent few hours to find out, that above working only when data-role="tagsinput" is removed from your

<input class="div-tag" />