Tags input limit about jquery-tags-input

[benbrown]

There is not currently a way to do this -- but I'm sure it could be added with relative ease to the addTag function. You should fork our code on Github and add it!

Ben Brown
/* I am a software designer and online community pioneer.
Learn more about what I do at http://XOXCO.com & http://PEOPLEPODS.net
and learn more about me at http://BENBROWN.com. */

On Thursday, March 15, 2012 at 10:21 AM, daniel2d2art wrote:

Hi guys!
What best approach for the control, to limit the number of tags allowed to input?
Thx!

---

Reply to this email directly or view it on GitHub:
#52

[daniel2d2art]

ok thx Ben!

[oliverkierepka]

Not the best way i know but i solved it like this:

1. Create a countTags() function

function countTags(tag) {
   tagcount = $("span.tag").length;
   $("#tags_tag").removeClass("error");
   if (tagcount > 4) {
      $('#tags').removeTag(tag);
      //show a notice to the user and add an error class to the textfield
      $(".notification_inline").remove();
      $("<span class='tag notification_inline error'>nur 4 Tags erlaubt</span>")
     .appendTo('#tags_tagsinput')
     .hide()
     .fadeIn(300)
     .delay(1000)
     .fadeOut(300)
     .removeTag();
     $("#tags_tag").addClass("error");
     $("#tags_tagsinput").animate({
    "backgroundColor" : 'rgba(250,0,0,0.8)'
      }, 300)
     .delay(1000).animate({"backgroundColor" : "white"}, 300);
     }
   }

3. call the countTags() function from the onAddTag() function:

function onAddTag(tag) {
   countTags(tag);
}

[phuongdev89]

i found a solution can resolve this:

    var tagcount = 0;
    $('#tags').tagsInput({
        onAddTag: function(elem, elem_tags){
            tagcount += $(this).length;
            if(tagcount > 6){
                alert('You have only 6 tags!');
                $(this).removeTag(elem);
            }
        },
        onRemoveTag: function(){
            tagcount -= $(this).length;
        }
    });

[jokewd]

Nice, thanks @notteen!