web-dev-qa-db-ja.com

Bootstrapタグ入力-オブジェクト値を事前入力する方法

私はBootstrapタグ入力をフォームに入力し、次のコードで初期化しています。

$('#looking_for_job_titles').tagsinput({
    itemValue: 'id',
    itemText: 'name'
});

// TypeAhead.js 
var job_scopes = new Bloodhound({
    datumTokenizer: function(d) {
        return Bloodhound.tokenizers.whitespace(d.value);
    },queryTokenizer: Bloodhound.tokenizers.whitespace,
    limit: 100,
    remote: {
        url: 'http://www.domain.com/json.php?action=job_title&q=%QUERY'
    }
});

job_scopes.initialize();

$('#looking_for_job_titles').tagsinput('input').typeahead({
        itemValue: 'name'
    },
    {
        name: 'job_scope',
        displayKey: 'name',
        source: job_scopes.ttAdapter(),
        templates: {
            empty: [
                '<div class="empty-message">',
                'no results found',
                '</div>'
            ].join('\n'),
            suggestion: function(data){
                return '<p>'+ data.industry +'> <strong>' + data.name + '</strong></p>';
            }
        },
        engine: Hogan
    }).bind('typeahead:selected', $.proxy(function (obj, datum) {
        this.tagsinput('add', datum);
    }, $('#looking_for_job_titles')));

これは正常に機能し、コンマで区切られたIDのリストを返します。これをdbに保存します。

私の問題は、ページ更新時にオブジェクト値を入力フィールドに事前入力する方法です。オブジェクトは次のようになります。

[{"id":"80001","name":"Account Manager"},{"id":"80251","name":"Projektant"}]
jquerytwitter-bootstraptags
12
user1049961

これが必要な人のために：

$.each(obj, function(index, value) {
    $('#looking_for_job_titles').tagsinput('add', value);
    console.log(value);
});
15
user1049961

メソッドのドキュメントを確認してください ここ 。

次を使用できます。

$('input').tagsinput('add', 'some tag');

そして

$('input').tagsinput('refresh');
8
Alberto Cerqueira

したがって、value = "[{" id "：" 80001 "、" name "：" Account Manager "}、{" id "：" 80251 "、" name "：" Projektant "}]"になります。

0
Tomáš Tibenský

シンプルで、その入力のvalue = ""属性を入力しますが、JavaScriptは使用しないでください。正しい形式value = "1,2,3"でこれを行うと、機能します

0
Tomáš Tibenský