bootstrap typeahead bloodhound返回名称和id

时间:2015-01-30 04:42:39

标签: javascript jquery twitter-bootstrap typeahead

我正在使用typeahead.js。 我希望这个函数可以产生更多的输出,不仅仅是一个名字,还有id。 这次我只能显示名字。请帮帮我。

var product = new Bloodhound({
    datumTokenizer: function (d) {
       return d.tokens;
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
       remote: {
          url: "http://localhost/shop/bangunadmin/ajax/get_products",
          replace: function (url, query) {
                return url + '#' + query;
                },
          ajax: {
             type: "POST",
             data: {
                 q: function () {
                    return $('#product-name3').val();
                 }
             }
          }
      }
   });
   $("#product-name3").typeahead(null, {
         name: "product", 
         displayKey: "name", 
         source: product.ttAdapter(), 
         hint: true, 
   });
   product.initialize();

1 个答案:

答案 0 :(得分:0)

使用custom-templates ==> custom-templates

$(input_example).typeahead(null, {
            name: 'example',
            displayKey: 'name',
            source: example.ttAdapter(),
            //custom your output (in example use Handlebars.js)
            templates: {
                suggestion: Handlebars.compile(
                    '<div class="text-left" style="color:#222;" data-scode="{{ name }}"><p class="text-left"><strong>{{ id }}</strong></p><div>')
            }
        })