Tags and autocomplete on node.js with Jade and Bootstrap

i'm trying to implement a tagging feature like here on stackoverflow, but the combination of jade, jquery is not something i can overcome so far... I am using bootstrap so bootstrap-tagmanager seems a great choice but i can't implement it. I've found this fiddle here: http://jsfiddle.net/vt2z4/ but even with this i simply can't. Has anyone done it or have any suggestions?

The fiddle code is 

<input type="text" name="tags" placeholder="Tags" class="tagsManager"/>
<input type="hidden" value="Pisa,Rome" name="hiddenTagList">

Javascript:

$(function () {
    $(".tagsManager").tagsManager({
         prefilled: ["Pisa", "Rome"],
         CapitalizeFirstLetter: true,
         preventSubmitOnEnter: true,
         typeahead: true,
         typeaheadAjaxSource: null,
         typeaheadSource: ["Pisa", "Rome", "Milan", "Florence", "New York", "Paris",      "Berlin", "London", "Madrid"],
         delimeters: [44, 188, 13],
         backspace: [8],
         blinkBGColor_1: '#FFFF9C',
         blinkBGColor_2: '#CDE69C',
         hiddenTagListName: 'hiddenTagListA'
     });
});

Recently I was working on a POC(a simple weather reporting webapp) using express, jade, bootstrap and tagmanager. I am able to make the tags input field work and I have shared the POC on GitHub.

The jade template file looks something like below code snippet.

block content
  .jumbotron
    h2 Weather report
    h3 Welcome to the weather report page!

  div.container
    .navbar.navbar-default(role='navigation')
      .container-fluid
        .collapse.navbar-collapse
          form(name="report", class="navbar-form navbar-left", action="/weather/report", method="POST")
            input(type="text", name="cities", class="form-control", data-role="tagsinput", placeholder="Type in city and press enter...")
            input(type="submit", class="btn btn-default", value="Submit")

  div.footer

One of the attribute of the cities input field is data-role="tagsinput".

The input field looks something like below image: enter image description here

Then, I have a route(routes/weather.js) which will be hit once user clicks on the submit button.

I hope this will be helpful for you. Please comment if anyone needs further clarification.

Try to keep it simple at first. Let us know what exactly doesn't work for you and post your code (not working example code) so we can actually help.

Basic example

If using twitter bootstrap begin with a simple static data test by using data attributes like this (don't forget the js and css includes required for bootstrap)

<input type='text' data-provide='typeahead' autocomplete='off'  data-items='4'  
data-source='["one", "two", "three", "four", "five"]'/>

Resources

Some more examples: http://twitter.github.io/typeahead.js/examples/

typeahead doc: http://twitter.github.io/bootstrap/javascript.html#typeahead