Allow free input in bootstrap-tags input (Objects as tags)

Question

I am using bootstrap-tags input (Objects as tags) for my tags input. It's work fine with typehead js auto complete suggestions as official document said Objects as tags. But this only allows suggested tags as input, in other word, only those which are in Json list. I trying to allow freeinputs along with suggested tags from the list with default value (example: stackoverflow Tags). But I couldn't able to do it right. Here is my code:

var cities = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('text'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            local: citilist //{value: 1, text: "Saint Lucia", continent: "Ararat"}... 
        });

        cities.initialize();
        var elt = $('#txt');
        elt.tagsinput({
            itemValue: 'value',
            itemText: 'text',
            typeaheadjs: {
                name: 'cities',
                displayKey: 'text',
                source: cities.ttAdapter()
            },
            freeInput: true
        });
        elt.tagsinput('add', { "value": 1, "text": "Amsterdam", "continent": "Europe" });

Answer 1

You can try this code. It's work for me. Please write this with your existing code.

var count = 0; 
$('body').on('keydown', '.tt-input', function (e) {
  if (e.keyCode === 9) {
    e.preventDefault();

    $('#your-tag-input-Id').tagsinput('add', { 
      value: --count, 
      text: $('.tt-input').val(), 
      continent: "Unsaved" 
    }); 

    $('.tt-input').val("");
  }
});

negative value is new added tag and positive value is suggested tags.

'.tt-input' is text box $('#txt') class.

Edit: Suggesting count-- to --count (-1 first, then return value), so that value's of free inputs start at -1