“[object Object]”在输入字段中显示bootstrap3-typeahead和tagsinput

时间:2015-06-04 15:31:33

标签: jquery json twitter-bootstrap bootstrap-tags-input

选择标记后,标记会正确添加,但文本[object Object]会附加在输入框中。 (见下图)

我正在使用Bootstrap 3,JQuery,Bootstrap3-typeahead和bootstrap-tagsinput(所有最新版本)

表单位于模态窗口中。

tag_error

以下是代码:

jQuery('#banner_geo_locations').tagsinput({
    itemValue: 'value',
    itemText: 'text',
    typeahead: {
        displayKey: 'text',
        source: function (query) {
            return jQuery.get("http://dev.marijuanaweeklycoupons.com/?action=ajax|cityStateSsearchTags&PageSpeed=off&q=" + query);
        }
    }
});

Ajax看起来像:

[{"value":"2908762","text":"Dixon Corner, AL"},
{"value":"2956030","text":"Dixon Corner, ME"},
{"value":"3008251","text":"Dixon Corner, PA"},
{"value":"2931983","text":"Dixon Crossroads, GA"},
{"value":"3017149","text":"Dixon Crossroads, SC"},
{"value":"2959449","text":"Dixon Estates, MD"},
{"value":"2959450","text":"Dixon Hill, MD"},
{"value":"2993971","text":"Dixon Landing, NC"},
{"value":"2908763","text":"Dixon Shop, AL"},
{"value":"2938722","text":"Dixon Springs, IL"}]

fiddle

中查看

2 个答案:

答案 0 :(得分:1)

这是一个图书馆问题。

添加以下内容可解决问题:

afterSelect: function(val) { this.$element.val(""); },

因此,

jQuery('#banner_geo_locations').tagsinput({
    itemValue: 'value',
    itemText: 'text',
    typeahead: {
        displayKey: 'text',
        afterSelect: function(val) { this.$element.val(""); },
        source: function (query) {
            return jQuery.get(current_web_root + "?action=ajax|cityStateSearchTags&PageSpeed=off&q=" + query);
        }
    }
});

参见jsfiddle

https://jsfiddle.net/rgaxuyda/11/

答案 1 :(得分:0)

幸运的爱德华,很好,谢谢。

<script>
    var elt = $('#inputSoftwareList');
    elt.tagsinput({
        itemValue: 'value',
        itemText: 'text',
        typeahead: {
            source: function(query) {
                return $.getJSON('cities.json');
            },
            afterSelect: function(val) { this.$element.val(""); }
        }
    });

</script>