2014-02-05 4 views
1

У меня есть веб-сайт, созданный в Bootstrap v3.1.0, и внутри у меня есть поле ввода текста. Я хочу применить auto-complete к нему, но не могу заставить Typeahead.js работать!Bootstrap 3.1.0 с Typeahead

Когда я ввожу что-то, я не получаю автоматическое заполнение!

View Code:

@Html.TextBoxFor(x => x.Manufacturer, new { @class = "form-control manufacturer" }) 
@Html.ValidationMessageFor(x => x.Manufacturer) 

JS код

$(function() { 
    $('.manufacturer').typeahead(null, 
     { 
      name: 'manufacturers', 
      local: ["Audi", 
        "BMW", 
        "Vauxhall", 
        "Toyota" 
        ] 
     }); 
}); 

Что я делаю неправильно? Я также добавил autocomplete="off" в поле ввода, но это все еще ничего не делало. Я также убедился, что все сценарии загружаются.

Я был бы очень признателен за любую помощь.

Thank you.

ответ

1

Кажется, что если вы используете 'HEAD' из twitter typeahead, вы немного отстаете от кривой в своих примерах.

var cars = new Bloodhound({ 
    datumTokenizer: function (d) { 
     return Bloodhound.tokenizers.whitespace(d.car); 
    }, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    local: [{ 
     car: "Audi" 
    }, { 
     car: "BMW" 
    }, { 
     car: "Vauxhall" 
    }, { 
     car: "Toyota" 
    }] 
}); 

$(function() { 
    cars.initialize(); 
    $('.manufacturer').typeahead(null, { 
     name: 'manufacturers', 
     displayKey: 'car', 
     source: cars.ttAdapter() 
    }); 
}); 

Также скрипку в действии: http://jsfiddle.net/Mutmatt/7jxRy/

Большая часть информации можно найти на http://twitter.github.io/typeahead.js/examples/ и https://github.com/twitter/typeahead.js