Tokenfield (tag input) autocomplete in Bootstrap 3 doesn't work

Question

I am trying to implement a simple tags input in Bootstrap 3 with Tokenfield, but I've stacked somewhere.

HTML code:

<link href="/static/css/bootstrap.min.css" rel="stylesheet">
<link href="/static/css/bootstrap-tokenfield.min.css" rel="stylesheet">

<div class="form-group">
   <label for="myinput">Κατηγορία</label>
   <input id="myinput" type="text" class="form-control">
</div>

Javascript:

<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<script src="/static/js/bootstrap-tokenfield.min.js"></script>

<script type="text/javascript">
   $('#myinput').tokenfield({
  autocomplete: {
    source: ['red','blue','green','yellow','violet','brown','purple','black','white'],
    delay: 100
  },
  showAutocompleteOnFocus: true
})
</script>

Error: It doesn't show the autocomplete. I don't have any error in the console. I can add tags manually.

Answer 1

From what I see this it's the same problem I had a few days ago. What you need as well is jquery-ui with autocomplete.js.

http://jqueryui.com/download/ generate your own jquery-ui.min.js including autocomplete.js and it should work.