Я хотел добиться аналогичного результата, поэтому я взглянул на код с опережением ввода и кое-что взломал, см. ниже:
Это все еще немного глючит с обработкой заполнителей и закрытием раскрывающегося списка, когда вы щелкаете, но это дает мне кнопку переключения, которую я могу щелкнуть, которая является родственной для моего элемента ввода, и она извлекает полный список из набора данных вместо небольшой список предложений.
Пример html (я использую пользовательские привязки данных для нокаута, но вы поняли):
<div class="col-md-12 input-group tt-dropdown-group">
<input id="category" name="category" type="text" class="form-control" data-bind="
attr: { placeholder: categoryCaption },
typeahead: categories,
typeaheadValueKey: 'Name',
typeaheadValue: category,
typeaheadDestroy: true" />
<span id="category-drop" class="input-group-addon tt-dropdown-icon">
<span class="glyphicon glyphicon-chevron-down"></span>
</span>
</div>
Пример javascript с использованием jQuery:
$(".tt-dropdown-group .tt-dropdown-icon").on("click", function() {
var $input = $(this).parent(".tt-dropdown-group").find("input.tt-query");
var $toggleBtn = $(this);
// these are all expected to be objects so falsey check is fine
if (!$input.data() || !$input.data().ttView || !$input.data().ttView.datasets || !$input.data().ttView.dropdownView || !$input.data().ttView.inputView) {
return;
}
var ttView = $input.data().ttView;
var toggleAttribute = $toggleBtn.attr("data-toggled");
if (!toggleAttribute || toggleAttribute === "off") {
$toggleBtn.attr("data-toggled", "on");
$input.typeahead("setQuery", "");
if ($.isArray(ttView.datasets) && ttView.datasets.length > 0) {
// only pulling the first dataset for this hack
var fullSuggestionList = []; // renderSuggestions expects an suggestions array not an object
$.each(ttView.datasets[0].itemHash, function(i, item) {
fullSuggestionList.push(item);
});
ttView.dropdownView.renderSuggestions(ttView.datasets[0], fullSuggestionList);
ttView.inputView.setHintValue("");
ttView.dropdownView.open();
}
}
else if (toggleAttribute === "on") {
$toggleBtn.attr("data-toggled", "off");
ttView.dropdownView.close();
}
person
Pricey
schedule
27.09.2013