I just came across Bootstrap tagsinput and I am trying it out, but I cant seem to get it working.
I added the following at the top of my layout :
<link rel="stylesheet" href="~/Scripts/bootstrap_tagsinput/bootstrap-tagsinput.css">
And I added the following at the bottom of my layout :
<script src="~/Scripts/bootstrap_tagsinput/bootstrap-tagsinput.js"></script>
Then in my partial page I added the following :
<input type="text" value="" data-role="tagsinput" id="tags" class="form-control">
Below is an image of what is happening, instead of the tags showing:
To my understanding, this should work. What am I missing ?
I think that because it's a partial view and it appears after the library is loaded, it doesn't get applied.
I had exactly the same problem. My Index page had all the libraries included but the partial view never used them.
I had to add this to the partial view Razor to force it to apply after load.
<script>
$(function () {
$('input[data-role=tagsinput]').tagsinput();
}
);
</script>
Add this links in your page
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.2/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
DEMO
Bootstrap - tagsinput , Github - Reference
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With