한도에 도달하면 태그를 배열에 추가하는 것을 중지하는 방법은 무엇입니까?

Question

나는 내가 사용 상자에 삽입 할 수있는 태그의 양에 제한을 설정 시도했다 :이 비록

tagLimit: 2, 

당신이 상자에 2 개 이상의 입력을 중지, 그것은 여전히 ​​'sampleTags'에 추가 정렬. 한계에 도달하면 배열에 추가하는 것을 방지하는 방법을 아는 사람이 있습니까?

JSFiddle 님의 경우 http://jsfiddle.net/uVxXg/137/

Answer 1

tagit이 제공 한 afterTagAdded 이벤트를 사용하고 코드를 그는 거기에 배열로 가치. 코드 만 태그가 정말 추가 될 때 실행됩니다이 방법 :

코드

// When the user clicks submit 
    $('form').submit(function(e) { 
    var inp = $('#tagInput').val(); 
    $('#tagInput').val(''); 
    $('#tags').tagit('createTag', inp); 
    sampleTags.push(inp); 
    e.preventDefault(); 
    }); 

으로 라인 제거 "sampleTags.push (INP)를;"

은 (afterTagAdded 이벤트 참조) tagit 함수에 다음 코드를 추가합니다 :

// When the user clicks submit 
    $('#tags').tagit({ 
    availableTags: sampleTags, 
    tagLimit: 2, 
    afterTagRemoved: function(evt, ui) { 
     console.log(ui.tagLabel) 
     for(var i = 0; i < sampleTags.length; i++) { 
     if (sampleTags[i] == ui.tagLabel) { 
      sampleTags.splice(i, 1); 
     } 
     } 
    }, 
    afterTagAdded: function(evt, data){ 
     sampleTags.push(data.tagLabel); 
    } 
    }); 

여기 예를 들어 작업을 참조하십시오 : http://jsfiddle.net/uVxXg/142/

UPDATE :

이 코멘트에 대답하기 위해. tagLimit에 도달하면 피드백을 제공하려면 "onTagLimitExceeded"를 사용하십시오. 여기 예를 들어 작업 : http://jsfiddle.net/uVxXg/144/

afterTagAdded: function(evt, data){ 
     sampleTags.push(data.tagLabel); 
    }, 
    onTagLimitExceeded: function(evt, data){ 
     alert('Tag limit reached!'); 
    } 

당신은 여기에 태그 - 그것의 GitHub의 페이지에있는 모든 이벤트의 목록을 찾을 수 있습니다 한계에 도달하면

Answer 2

당신은 단지를 추가 할 수 있습니다 기능 느릅 나무가

$('form').submit(function(e) { 
    if(sampleTags.length < 2){ 
     var inp = $('#tagInput').val(); 
     $('#tagInput').val(''); 
     $('#tags').tagit('createTag', inp); 
     sampleTags.push(inp); 
    } 
    e.preventDefault(); 
    }); 

필자 업데이트 당신의 바이올린 (http://jsfiddle.net/uVxXg/139/)

나는이 희망

변수 sampleTags의 길이를 확인하여 제출 당신을 위해 일합니다 :)