Bootstrap 4 TagsInput maxNumTags is not working

Question

I want to set max 5 tags in my input field but maxNumTags:5 is not working in jquery What should I do to set a maximum value for tagsInput?

HTML

<input
  type="text"
  class="form-control"
  id="tags"
  name="tags"
  value="{{ old('tags') }}"
  data-role="tagsinput"
/>

And here is the script

<script src="dashboard-assets/js/tagsinput.js"></script>
<script>
  $("#tags").tags({
    maxNumTags: 5
  });
</script>

Answer 1

Use maxTags to set the max number of inputs tags. You can also use allowDuplicates: true to allow duplicate tags in same input.

Working Demo: http://jsfiddle.net/usmanmunir/gh7cy2vf/

Run Snippet below to see it working.

$(document).ready(function() {
  $('.tags').tagsinput({
    maxTags: 5,
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.js" integrity="sha512-VvWznBcyBJK71YKEKDMpZ0pCVxjNuKwApp4zLF3ul+CiflQi6aIJR+aZCP/qWsoFBA28avL5T5HA+RE+zrGQYg==" crossorigin="anonymous"></script>

Type Here: <input type="text"
  class="form-control tags"
  id="tags"
  name="tags" placeholder="Add tags here">