Select2限制標籤數量

有沒有辦法限制用戶使用Select2可以添加到輸入字段的標籤數量？Select2限制標籤數量

我：

$('#tags').select2({ 
    containerCssClass: 'supplierTags', 
    placeholder: "Usual suppliers...", 
    minimumInputLength: 2, 
    multiple: true, 
    tokenSeparators: [",", " "], 
    placeholder: 'Usual suppliers...', 
      createSearchChoice: function(term, data) { 
       if ($(data).filter(function() { 
        return this.name.localeCompare(term) === 0; 
       }).length === 0) { 
        return {id: 0, name: term}; 
       } 

      }, 
    id: function(e) { 
     return e.id + ":" + e.name; 
    }, 
    ajax: { 
     url: ROOT + 'Call', 
     dataType: 'json', 
     type: 'POST', 
     data: function(term, page) { 
      return { 
       call: 'Helpers->tagsHelper', 
       q: term 
      }; 
     }, 
     results: function(data, page) { 
      return { 
       results: data.tags 
      }; 
     } 
    }, 
    formatResult: formatResult, 
    formatSelection: formatSelection, 
    initSelection: function(element, callback) { 
     var data = []; 
     $(element.val().split(",")).each(function(i) { 
      var item = this.split(':'); 
      data.push({ 
       id: item[0], 
       name: item[1] 
      }); 
     }); 
     callback(data); 
    } 
});

這將是巨大的，如果有可能是/是像limit: 5一個簡單的參數和回調達到限制時開火。

來源

2014-01-27 imperium2335

當然，與maximumSelectionLength像這樣：

$("#tags").select2({ 
    maximumSelectionLength: 3 
});

最大選擇長度

選擇二允許開發者限制項目，可以在多選擇控制選擇的數目。

http://ivaynberg.github.io/select2/

它沒有本地回調，但你可以通過一個函數來formatSelectionTooBig這樣的：

$(function() { 
    $("#tags").select2({ 
     maximumSelectionLength: 3, 
     formatSelectionTooBig: function (limit) { 

      // Callback 

      return 'Too many selected items'; 
     } 
    }); 
});

http://jsfiddle.net/U98V7/

或者你可以擴展formatSelectionTooBig這樣的：

$(function() { 
    $.extend($.fn.select2.defaults, { 
     formatSelectionTooBig: function (limit) { 

      // Callback 

      return 'Too many selected items'; 
     } 
    }); 

    $("#tags").select2({ 
     maximumSelectionLength: 3 
    }); 
});

編輯

替換maximumSelectionSize與更新maximumSelectionLength。謝謝@DrewKennedy！

來源

2014-01-27 11:50:17

謝謝！即使達到此限制，是否有辦法解僱？那將是完美的。 – imperium2335

沒有本地回調，但我添加了一個可能的解決方案給我的答案。 –

@MagnusEngdal謝謝.... –

這不適用於我，我得到query function not defined for Select2，所以這裏是另一種解決方法。

 var onlyOne=false; 
     $("selector").select2({ 
      maximumSelectionSize:function(){ 
       if(onlyOne==true) 
        return 1; 
       else 
        return 5; 
      } 
     });

此設置可以定義爲函數，每次開始搜索時都會調用它。

重要的是你有一些定義在這個select2閉包之外的東西，所以你可以檢查它（訪問它）。在這種情況下，你可以在程序中的某處更改值onlyOne，當然這個返回的限制也可以是動態的。

來源

2014-07-01 19:21:14

傳播這個詞http://stackoverflow.com/a/29488028/2644170 – animaacija

maximumSelectionSize現在可以設置爲一個整數來限制選擇的數量。 – bJacoG

接受的答案沒有提到maximumSelectionLength語句應該在document.ready函數內。所以對於那些遇到同樣問題的人來說，這裏是適合我的代碼。

$(document).ready(function() { 

      $("#id").select2({ 
      maximumSelectionLength: 3 
      }); 

     });

來源

2016-12-02 14:59:01

$("#keywords").select2({ 
    tags : true, 
    width :'100%', 
    tokenSeparators: [','], 
    maximumSelectionLength: 5, 
    matcher : function(term,res){ 
     return false; 
    }, 
    "language": { 
     'noResults': function(){ 
      return "Type keywords separated by commas"; 
     } 
    } 
}).on("change",function(e){ 
    if($(this).val().length>5){ 
     $(this).val($(this).val().slice(0,5)); 
    } 
});

嘗試這樣的。它最多可以縮短5個關鍵字。

來源

2016-12-06 11:51:17

這正是我所期待的。謝謝！ – adpro

這是查詢工作:)謝謝！ –

Select2限制標籤數量

回答

相關問題