Tag-it onlyAvalaibleTags選項不起作用

Question

我使用https://github.com/aehlke/tag-it/downloads的tag-it插件。如何禁用添加新標籤？

$(document).ready(function() { 
       $("#Tags").tagit({ 
        singleField: true, 
        singleFieldNode: $('#mySingleField'), 
        // onlyAvailableTags : true, 
        allowNewTags: false, 
        tagSource: [@Html.Raw(ViewBag.AvailableTags)] 
       }); 
      }); 

我試圖用onlyAvailableTags : true和allowNewTags: false選項，但沒有效果。

Answer 1

既然你說「但沒有任何效果」，我猜想@Html.Raw(ViewBag.AvailableTags)會產生一個打破javascript語法的輸出。標籤需要用引號括起來，否則它們會被當作變量處理。

Incorrrect輸出：

tagSource: [my-tag, another-tag] 

服務器端，我假設你有某種IEnumerable<string>：

ViewBag.AvailableTags = new List<string> 
{ 
    "my-tag", 
    "another-tag", 
}; 

然後，在你.cshtml：

tagSource: ["@string.Join("\", \"", ViewBag.AvailableTags)"] 

這將產生正確的輸出：

tagSource: ["my-tag", "another-tag"] 

那會是什麼，我想先試。

Answer 2

我發現，通過註釋掉：

// Autocomplete will create its own tag from a selection and close automatically. 
if (!that.tagInput.data('autocomplete-open')) { 
    that.createTag(that._cleanedInput()); 
} 

和：

// Create a tag when the element loses focus. 
// If autocomplete is enabled and suggestion was clicked, don't add it. 
if (!that.tagInput.data('autocomplete-open')) { 
    that.createTag(that._cleanedInput()); 
} 

它消除了此功能。也許不是最乾淨的方式，但它的工作原理。

只是評論了if(){ }循環。

Answer 3

這就是我所做的最新的版本的標籤是：

var tags_list = ['tag1', 'tag2, 'tag3]; 

$("input[name='subject-tags']").tagit({ 
    availableTags : tags_list, 
    beforeTagAdded : function(event, ui) { 
     if(tags_list.indexOf(ui.tagLabel) == -1){ 
      return false; 
     } 
    } 
}); 

試圖通過實施

$("input[name='subject-tags']").tagit({ 
    availableTags : ['tag1', 'tag2, 'tag3], 
    beforeTagAdded : function(event, ui) { 
     if(this.availableTags.indexOf(ui.tagLabel) == -1){ 
      return false; 
     } 
    } 
}); 

但this.availableTags不返回數組（返回使它更清潔： undefined）。我是一個JS noob，所以我訪問該房產的方式肯定有問題。