Geek Answers Handbook

Tagsinput is not a function using bootstrap 3 and tag-input plugin

I am using bootstrap 3 with jquery 1.10 and I am moving on to using the I / O plugin ( http://timschlechter.imtqy.com/bootstrap-tagsinput/examples/bootstrap3/ ), but it doesn’t work. That's my fault:

TypeError: tagsinput[arg1] is not a function var retVal = tagsinput[arg1](arg2);

This is my html code:

  <head> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAv92iA1TcfCnk4-bDg7BAJoKOCnh1g7oQ&sensor=false"></script> <link href="/qtip2/css/jquery.qtip.min.css" media="screen" rel="stylesheet" type="text/css" > <link href="/css/bootstrap.min.css" media="screen" rel="stylesheet" type="text/css" > <link href="/css/1309_ciceroos_b2b.css" media="screen" rel="stylesheet" type="text/css" > <link href="/css/1310_longdistance.css" media="screen" rel="stylesheet" type="text/css" > <link href="/bootstrap3.0.0/assets/css/bootstrap-tagsinput.css" media="screen" rel="stylesheet" type="text/css" ><script type="text/javascript" src="/bootstrap3.0.0/assets/js/jquery.js"></script> <script type="text/javascript" src="/js/infobox.js"></script> <script type="text/javascript" src="/qtip2/js/jquery.qtip.min.js"></script> <script type="text/javascript" src="/qtip2/js/imagesloaded.min.js"></script> <script type="text/javascript" src="/bootstrap3.0.0/dist/js/bootstrap.min.js"></script> <script type="text/javascript" src="/bootstrap3.0.0/assets/js/holder.js"></script> <script type="text/javascript" src="/bootstrap3.0.0/assets/js/bootstrap-tagsinput.js"></script> <script type="text/javascript"> jQuery(document).ready(function ($) { //$('.bootstrap-tagsinput input').attr("value", "interessi"); $('#idInputWhat').tagsinput('add', 'mare'); $('#idInputWhat').tagsinput('add', 'vino'); $('#idInputWhat').tagsinput({ maxTags: 3 }); }); </script> </head> <body> <form class="form-inline" role="form" id="idFormSearch" method="GET" action="javascript:void(0);"> <div class="form-group col-md-offset-1 col-md-5 _interestInput"> <input type="text" placeholder="Quali sono le tue passioni?" data-role="tagsinput" class="form-control input-lg" name="what" id='idInputWhat' value=""/> </div> <div class="form-group col-md-3 _interestInput"> <input type="text" placeholder="dove" class="form-control input-lg" name="where" id='idInputWhere' /> <input type="hidden" name="start" id='idStart' value="0"/> </div> <div class="col-md-3 _searchButton"> <input class="btn btn-primary btn-lg" type="submit" value="Ispirami!"></input> </div> </form> </body>

Please any suggestions?

+7
jquery twitter-bootstrap twitter-bootstrap-3 jquery-tags-input
source share
2 answers

It looks like if you specify both data-role="tagsinput" , then use $('#idInputWhat').tagsinput('add', 'vino'); then he will give this error. Try removing the data-role attribute and use only the explicit .tagsinput() .

I would think that this is a bug in the tagin plugin.

This seems to be confirmed; https://github.com/TimSchlechter/bootstrap-tagsinput/issues/42

+17
source share

Check if you included bootstrap-tagsinput.js script.

Seems to work for me: JSBin link

+1
source share

More articles:


All Articles