1

私は、Bootstrap 3.3.6、JQuery 1.11.0、Bootstrap3-typeahead 4.0.2、およびbootstrap-tagsinput 0.8.0を使用しています。tags input-typeaheadの値をタグ

私のタグ入力& typeaheadはうまくいきますが、タグは先読みから選択されたテキストの代わりに値を表示するにはどうすればよいですか?

値=プロジェクト数

テキスト=プロジェクト数+プロジェクト名

は、ここに私のコードです:

$('#jobno').tagsinput({ 
      confirmKeys: [13], 
      itemValue: 'value', 
      itemText: 'text', 
      typeahead: { 
       displayKey: 'text', 
       afterSelect: function(val) { this.$element.val(""); }, 
       minLength:3, 
       source: [{"value":"2006.01","text":"2006.01 - Project 1"},{"value":"2006.02","text":"2006.02 - Project 2"},{"value":"2006.03","text":"2006.03 - Project 3"}] 
      } 
    }); 

<div class="form-group"> 
    <label class="control-label col-md-3">Job Number(s) </label> 
    <div class="col-md-8"> 
     <!-- <input type="text" class="form-control tagsinput-typeahead" name="jobno" id="jobno" > --> 
     <select multiple="multiple" class="form-control tagsinput-typeahead" name="jobno" id="jobno" ></select> 
    </div> 
</div> 

これらのオプションのどちらも私が欲しいものです:

itemValue: 'value', 
itemText: 'value', 

itemValue: 'text', 
itemText: 'text', 

3番目の選択肢はありますか?

Screen Shot

答えて

1

ちょうどあなたのブートストラップ・tagsinput.jsを開き、であなたのカスタム値を変更します。 '+ htmlEncode(itemValue)+ ":" + htmlEncode(品目テキスト)+'

// add a tag element 

    var $tag = $('<span class="tag ' + htmlEncode(tagClass) + (itemTitle !== null ? ('" title="' + itemTitle) : '') + '">'+htmlEncode(itemValue) +": " + htmlEncode(itemText) + '<span data-role="remove"></span></span>'); 
    $tag.data('item', item); 
    self.findInputWrapper().before($tag); 
    $tag.after(' '); 

は、タグのテキストを表示する部分です。この場合、 "value:text"と表示されます。

関連する問題