Searched text shows up again after selecting the tag

[rdbcasillas]

Heres the code:

  var tagnames = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace,
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    local: ['interview', 'meeting', 'gossip']
  });
  tagnames.initialize();

  $('#tags').tagsinput({
    typeahead: {
      items: 4,
      source: tagnames.ttAdaptor()
    }
  });

---

When I type 'i' and select interview, 'i' automatically shows up again in the search box. Is this a known issue?

[librien]

Edit to add JSFiddle. https://jsfiddle.net/zuzabxfy/

Similar issue that i am having. When I use with tagsinput, I'm getting "duplicate" completions:

I'm using bootstrap3-typeahead.js v3.1.0

This happens when hitting enter, tab, or clicking on the result. It does not happen when I put a comma after the text, or if I change window focus, and come back to the window. It seems to only happen when using the typeahead to complete a result. I tested this with a static source (states), as well and I'm receiving the same problem.

My function is as follows:

        $('#itemCategory').tagsinput({
            confirmKeys: [13, 44],
            maxTags: 1,
           typeahead: {                  
            source: function(query) {
              return $.get('listcategories.php');
            }
          }
        });

Here is an image of the source in developer tools:

Thanks for any advice.

[shamroze]

May be you can try this, as i encountered the similar issue and this helped me resolved it

    $('.typeahead').on('itemAdded', function() {
        setTimeout(function() {
            $(">input[type=text]", ".bootstrap-tagsinput").val("");
        }, 1);
    });

[kedarv]

Can confirm that this issue is still occurring with the latest tagsinput and bootstrap-3-typeahead on a Bootstrap 4 app. @shamroze's solution works, but isn't ideal.