Using bootstrap typeahead-Collection of common programming errors

I’ve been trying to get bootstrap typeahead to work, however been having some difficulties doing so.

My code is the following:

$(document).ready(function() {
    var subjects = [{exp:freeform:entries form_id="2" status="open|closed|pending"}"", {/exp:freeform:entries}];
    $('input.typeahead"]').typeahead({source: subjects});
});

???? ????? ??? ??? ??????? ??? ??????;

???????? ?? ????? ??? ????   
{exp:freeform:entries form_id="2" status="open|closed|pending" limit="1"}
    
{/exp:freeform:entries} 

The exp tags you see are expression engine queries.

var subjects is an array populated by an expression engine query. this is the output as it comes out of the query.

["???????? ??????? ???????????????? ??", "???????? ??????? ????????????", " ???????? ??????? ?' ??????????", "??? ???????? ??????? ??????????", "???????? ??????? ????? ????????? (?.?.)", "?' ???????? ??????? ???????", "?' ???????? ??????????", "??????? ????? ???????? ?'", "gymnasio agiou vasiliou ", "? ???????? ??????? ??????????", "? ???????? ??????? ??????????", "???????? ??????? ???????????", "???????? ??????? ????? ?????? ", "?????? ???????? ???????????? ???????? ??????? ???????????", "???????? ??????? ????????", "?????? ???????? ???????? ???????????", "???????? ??????? ?????????", "?? ???????? ??????? ?????", "?????? ???????? ???????? ??????", "b' ??????? ????????????  ", "?? ???????? ??????? ??????", "?????? ???????? ???????????? ???????? ??????? "????????"", "??????? ??? ???????? ????? ?????????? ???????", "???????????? ???????? ??????? ????? ?????? ???????", "???????? ????? ??????????", "???????? ??????? ???????", "??? ???????? ???????? ??????? (??)", "?????? ???????? ???????? ??????? ??????", "???????? ??????? ??????????", "iz' ???????? ???????", "???????? ??????? ??????????", "k??? ???????? ?/???-???????? ???????????", "?? ???????? ???????", "???????? ???????? ?.?.", "?? ???????? ??????? ?.??", "???????? ??????? ????????", "???????? ??????? ???????", "?' ???????? ??????? ?????????", "??????? ??????? ???????", "???????? ????? ??????", "?' ???????? ??????? ?????????", "?' ???????? ??????? ?????", "???????? ????????? ", "the american academy nicosia", "pascal english school/ ???????? ????? ??????", "pascal english school/ ???????? ????? ??????", "???????????? ?????? ????????? ????? ?????????", ];

Now when I run the code, I get a message in the console, saying “uncaught referencerror: $ is not defined”

My first thought was that bootstrap did not contain the js plugin, however on double checking the boostrap git.io site, it clearly states that it is packaged in there. I even ran a ctrl+f on the js file and found references to the function (downloaded from http://twitter.github.io/bootstrap/).

Anyone got any ideas what I may be doing wrong?

Thanks in advance for your help!

1. Ok silly mistake, the page was to be loaded thru an ajax request. When testing the call, I ran the script file it’s self that didnt include my header and thus links to css & js files. doh!

Originally posted 2013-11-15 02:45:28.