我以一种相对简单的方式使用jQuery的自动完成:
$(document).ready(function() {
var data = [ {text: "Choice 1"},
{text: "Choice 2"},
{text: "Choice 3"} ]
$("#example").autocomplete(data, {
matchContains: true,
minChars: 0,
formatItem: function(item)
{ return item.text; }
}
);
});
Run Code Online (Sandbox Code Playgroud)
如何添加一个onclick事件(如按钮或链接),它将显示自动完成的所有可用选项?基本上我正在寻找自动完成和选择/下拉元素的混合.
谢谢!
我正在使用Autocomplete组合框中提供的自定义绑定和Knockout JS模板/ JQuery
我需要强制用户必须在自动完成列表中选择一个值,然后选择该值以便无法向select中添加其他文本.我搜索过,但找不到如何防止输入其他文本的示例.它必须保持可编辑状态,只要他们选择了错误的下拉菜单,但他们输入的内容必须与列表中的值匹配100%.
我在jquery上发现了这个帖子,但它已经9个月了,没人发布答案.
在我的Ruby on Rails应用程序中,我使用的是jQuery UI 1.9.2(直通jquery-ui-rails).我在Modal对话框表单中有一个Autocomplete字段,它使用Ajax和Json填充它的下拉列表建议框.它工作正常,向我显示正确的建议.
我随后升级到jQuery UI 1.10.3(使用bundle update),现在自动完成下拉列表建议框不再有效.它在JavaScript控制台中没有显示错误.实际上它表明返回的Json是正确的.
我已经尝试重写JS中的自动完成功能来手动执行调用(使用自动完成的source: $.ajax {}调用,但仍然没有.
有人向我建议问题可能是jQuery改变了导致jquery-ui-railsgem停止工作的东西,但在向他们提交bug票后,事实证明这不是问题.
任何帮助,将不胜感激.
回答注意:
mhu的答案是正确的,你应该尽可能避免篡改z索引(这就是为什么我把它标记为正确).但是在我的情况下(自动填充文本框位于模态对话框中),下拉列表将仅显示在对话框的宽度内(如果文本宽于此值,则隐藏它并且您无法使用滚动条).因为我不想那样,我做了我在下面的答案中所描述的并且它有效.我确实对自己做了各种评论和注释,以确保它在任何jQueryUI更新后仍然有效.
jquery jquery-ui autocomplete jquery-ui-autocomplete ruby-on-rails-3.2
我正在尝试Knockout.js的自动完成处理程序,并且正在寻找一些反馈。目前,这是可行的,但我试图查看在没有到处放置这么多Eval()的情况下是否可以完成工作,并且为了可重用性,请查看是否有一种方法可以在不预设前提下引用ViewModel名为“ vm”,如下所示。
用法:
<input placeholder="Test..." type="search" data-bind="autoComplete:$root.persons, source:'/api/Person/', parameterName:'searchString', labelKey:'displayName', valueKey:'urid', onSelected:'addPerson'" autocomplete="off" />
Run Code Online (Sandbox Code Playgroud)
JS:
ko.bindingHandlers.autoComplete = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
var postUrl = allBindingsAccessor().source; // url to post to is read here
var param = allBindingsAccessor().parameterName;
var labelKeyName = allBindingsAccessor().labelKey;
var valueKeyName = allBindingsAccessor().valueKey;
var selectedFunction = allBindingsAccessor().onSelected;
var selectedObservableArrayInViewModel = valueAccessor();
$(element).autocomplete({
minLength: 2,
autoFocus: true,
source: function (request, response) {
$.ajax({
url: param != null ? postUrl : postUrl + request.term,
data: …Run Code Online (Sandbox Code Playgroud) 我在将jQueryUI组合框值绑定到我的KnockoutJS ViewModel中的计算observable时遇到问题.我发现了一些类似的问题,比如" autocomplete-combobox-with-knockout-js-template-jquery "和" knockoutjs-jquery-combobox-binding ",但都没有解决我的问题.
我认为这一切都是因为jQueryUI组合框在更新底层选择时不会触发更改事件.
我在这里举了一个例子...... http://jsfiddle.net/farina/hLfWa/