Как сделать TagsInput работать с обоими автозаполнения и свободный текст

Question

UPDATE Этот вопрос уже обсуждался в GitHub here

Я использую tagsinput с машинописный в загрузчике 3. Проблема, которую я испытываю, с значение в случае, если пользователь выбирает существующий тег. Отображаемый текст показывает это правильно, но .val() возвращает свой фактический объект. Ниже приведен код

$('#tags').tagsinput({ 
         //itemValue: 'value', 
         typeahead: { 
          source: function (query) { 
           //tags = []; 
           //map = {}; 
           return $.getJSON('VirtualRoomService.asmx/GetTags?pid=' + $("#<%=hdnPID.ClientID%>").val() + '&tok=' + query) 
           //, function (data) { 
           // $.each(data, function (i, tag) { 
           //  map[tag.TagValue] = tag; 
           //  tags.push(tag.TagValue); 
           // }); 
           // return process(tags); 
           //}); 
          } 
         } 
         //freeElementSelector: "#freeTexts" 
        }); 

Проблема выше кода является то, что это приводит, как показано ниже при выборке теги из веб-метода

Это происходит, когда пользователь выбирает существующий тег. Новые теги отсутствуют. Я попытался установить itemValue & itemText of taginput, но не работал. Поэтому я решил решить эту проблему. Поскольку я мог бы получить строку json как ['IRDAI ", Object], если можно каким-то образом проанализировать этот объект & получить фактическое значение тега, тогда я получу ожидаемый результат кода, который я ищу.

Ниже приведено то, что он появляется в тэгах ввода, как [объект Object] для текста, выбранного пользователем из автоматического заселенной выпадающего [! [войти ТИМ Если я уточняю TagID & TagValue к ItemValue & itemText ниже код

  $('#tags').tagsinput({ 
       itemValue: 'TagId', 
       itemText: 'TagValue', 
       typeahead: { 
        source: function (query) { 
         //tags = []; 
         //map = {}; 
         return $.getJSON('VirtualRoomService.asmx/GetTags?pid=' + $("#<%=hdnPID.ClientID%>").val() + '&tok=' + query) 
         //, function (data) { 
         // $.each(data, function (i, tag) { 
         //  //map[tag.TagValue] = tag; 
         //  tags.push(tag.TagValue); 
         // }); 
         //}); 
         // return process(tags); 

        } 
       } 
       //freeElementSelector: "#freeTexts" 
      }); 

Тогда результат отображается, как показано ниже, когда под кодом

var arr = junit.Tags.split(','); 

          for (var i = 0; i < arr.length; i++) { 
           $('#tags').tagsinput('add', arr[i]); 
          } 

Answer 1

Учитывая ваш пример JSON ответа от источника данных:

[ 
    {"TagId":"1", "TagValue":"eSign"}, 
    {"TagId":"2", "TagValue":"eInsurance Account"} 
] 

Вы должны сказать tagsinput, как отобразить атрибуты из ваших объектов с помощью ответа itemValue и itemText в вашем файле конфигурации config. Похоже, что вы, возможно, начали по этому пути, но не прийти к выводу, что должно выглядеть примерно так:

$('#tags').tagsinput({ 
    itemValue: 'TagId', 
    itemText: 'TagValue', 
    typeahead: { 
    source: function (query) { 
     return $.getJSON('VirtualRoomService.asmx/GetTags?pid=' + $("#<%=hdnPID.ClientID%>").val() + '&tok=' + query); 
    } 
    } 
}); 

Убедитесь, что проверка tagsinput examples.

Answer 2

Это может быть не чистое решение, но я обошел эту проблему с помощью метода парсинга. Надеюсь, это поможет кому-то.

  var items = $('#tags').tagsinput("items"); 
      var tags = ''; 
      for(i = 0; i < items.length; i++) 
      { 
       if(JSON.stringify(items[i]).indexOf('{') >= 0) { 
        tags += items[i].TagValue; 
        tags += ','; 
       } else { 
        tags += items[i]; 
        tags += ','; 
       } 
      }