Twitter的引导键盘缓冲 - ID和放大器;标签 [英] Twitter Bootstrap Typeahead - Id & Label

问题描述

我使用的是引导2.1.1和jQuery 1.8.1，并尝试使用键盘缓冲的功能。

I'm using Bootstrap 2.1.1 and jQuery 1.8.1 and trying to use Typeahead's functionality.

我试着显示标签并使用 ID 像一个标准的＆LT;选择/＆GT;

I try to display a label and use an id like a standard <select />

下面是我的预输入初始化：

Here is my typeahead initialization:

$(':input.autocomplete').typeahead({
    source: function (query, process) {
        $('#autocompleteForm .query').val(query);
        return $.get(
            $('#autocompleteForm').attr('action')
          , $('#autocompleteForm').serialize()
          , function (data) {
              return process(data);
          }
        );
    }
});

下面是JSON的是我送的那种

Here is the kind of JSON that I'm sending

[{"id":1,"label":"machin"},{"id":2,"label":"truc"}]

我怎么能告诉进程（）来显示我的标签和所选择的ID存储在另一个隐藏字段？

How can I tell process() to display my labels and store the selected ID in another hidden field?

推荐答案

这里有一个伟大的教程，说明如何做到这一点：<一href=\"http://tatiyants.com/how-to-use-json-objects-with-twitter-bootstrap-typeahead/\">http://tatiyants.com/how-to-use-json-objects-with-twitter-bootstrap-typeahead/ （阅读我的网页上发表评论，如果它尚未在后的主要部分尚未反映出来）。

There's a great tutorial here that explains how to do this: http://tatiyants.com/how-to-use-json-objects-with-twitter-bootstrap-typeahead/ (read my comment on that page if it hasn't been reflected yet in the main part of the post).

根据该教程，和您提供的JSON，你可以做这样的事情：

Based on that tutorial, and the JSON you provided, you can do something like this:

$(':input.autocomplete').typeahead({
    source: function(query, process) {
        objects = [];
        map = {};
        var data = [{"id":1,"label":"machin"},{"id":2,"label":"truc"}] // Or get your JSON dynamically and load it into this variable
        $.each(data, function(i, object) {
            map[object.label] = object;
            objects.push(object.label);
        });
        process(objects);
    },
    updater: function(item) {
        $('hiddenInputElement').val(map[item].id);
        return item;
    }
});                    

这篇关于Twitter的引导键盘缓冲 - ID和放大器;标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！