引导标签输入 - 如何预填充对象值答案

【问题标题】：Bootstrap Tags Input - how to prefill object values引导标签输入 - 如何预填充对象值
【发布时间】：2014-05-17 16:06:39
【问题描述】：

我在我的表单中使用引导标签输入，用以下代码初始化：

$('#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"}]

【问题讨论】：

标签： jquery twitter-bootstrap tags

【解决方案1】：

对于任何需要这个的人：

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

【讨论】：

【解决方案2】：

查看Method here的文档。

你可以使用：

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

和

$('input').tagsinput('refresh');

【讨论】：

这对我有用。

【解决方案3】：

应该很简单，填写该输入的value="" 属性，但没有javascript。如果您以正确的格式 value="1,2,3" 执行此操作，它将起作用

【讨论】：

是的，但我需要 id + value 组合。在底部查看我的解决方案。
如果您将该值作为 json 存储在输入中并使用 json_encode 并在后端解码它会怎样？

【解决方案4】：

原来如此

value=" [{"id":"80001","name":"Account Manager"},{"id":"80251","name":"Projektant"}]"

【讨论】：