开发者

Limit number of input tags in jQuery

I've been searching for a jQuery auto-suggest tags (similar to the stackoverflow tags input) plugin which restricts the number of input tags (ie. does n开发者_JAVA百科ot allow to create more than 5 tags for example?). If someone knows such plugin, or is kind enough to modify this code to Limit the number of tags, I'll be really thankful.


Ok made a change to the Tag It plugin...

First open up the plugin js file and find the is_new function(towards the bottom of the file)...

replace the entire function with this:

    function is_new (value){
        var is_new = true;
        var count = 0;
        this.tag_input.parents("ul").children(".tagit-choice").each(function(i){
            count++;
            n = $(this).children("input").val();
            if (value == n || count >= options.maxTags) {
                is_new = false;
            }
        })
        return is_new;
    }

Notice I only added the count variable and modified the if statement in the loop to check if count is >= the option maxTags

Then when u call the plugin, set the maxTags option:

    $('#tagBox').tagit({
        availableTags: '../Tag/GetTags',
        maxTags: 5
    });

easy!


I didn't look though your code, but i'm assuming you have a convention for delimiting what tags are (space, comma, other) so you could track the number of dlimiters and then just not allow them to type after the 5th delimiter has been typed.


This one looks good. Look at the selectionLimit property.


Just in case anyone else is using the latest version of tag-it, here is the solution : ) ENJOY!

_isNew: function(value) {
        var that = this;
        var isNew = true;
        //JAVI ADDED NEXT LINE
        var count = 0;
        this.tagList.children('.tagit-choice').each(function(i) {
            //JAVI ADDED NEXT LINE AND MODIFIED IF (ADDING SECOND CONDITION)
            count++;
            if (that._formatStr(value) == that._formatStr(that.tagLabel(this)) || count >= that.options.maxTags) {
                isNew = false;
                return false;
            }
        });
        return isNew;
    },
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜