Tag: jquery ui autocomplete

自动完成jQuery使用JSON数据: 想象一下包含以下数据的json文件： [ { color: “red”, value: “#f00” }, { color: “green”, value: “#0f0” }, { color: “blue”, value: “#00f” }, { color: “cyan”, value: “#0ff” } ] 使用jQuery的自动完成方法，我希望它能够将颜色显示为选项，以便在输入上选择和插入值。以上不需要介绍。选择器用于搜索颜色， input.color用颜色值， input.value用值值。编辑：我有这个JSON数据： [{ “label”: “Sec\u00e7\u00e3o 1”, “value”: “1” }, { “label”: “Sec\u00e7\u00e3o 2”, “value”: “2” }, { “label”: “Sec\u00e7\u00e3o 3”, “value”: “3” }, […]

Jquery uicombobox（自动完成）消失: 我正在尝试这样做http://jqueryui.com/autocomplete/#combobox问题是，当我用鼠标选择一个选项时，选项将消失并且它出现了建议：“x不符合任何item“其中x是我在combobox中写的字母。现在我发布网站上的脚本： (function( $ ) { $.widget( “ui.combobox”, { _create: function() { var input, that = this, wasOpen = false, select = this.element.hide(), selected = select.children( “:selected” ), value = selected.val() ? selected.text() : “”, wrapper = this.wrapper = $( “” ) .addClass( “ui-combobox” ) .insertAfter( select ); function removeIfInvalid( element ) { var value […]

JQuery自动完成自定义显示多列第2部分: 我试图得到一个类似于自动完成：在jquery ui中的自定义示例。相反，它将使用ajax调用而不是硬编码数据。我想要显示两列（值和描述）。当用户输入时，.val（）将传递给ajax页面，并提供建议。第一列将用于该值。我能够使用简单的单列示例返回单个列，但不能使用多个值。我认为它很简单，因为它是示例代码的重新哈希。感谢您的帮助。 $(document).ready(function() { $(‘#myinputbox’).autocomplete({ minLength: 4, source: function(request, response){ var ajaxparam = $(‘#myinputbox’).val(); ajaxparam = escape(ajaxparam); var querystring = “?term=” + ajaxparam; $.ajax({ url: ‘ajax/jsonencode.php’+querystring, beforeSend: function(){ alert(“beforeSend”); }, async: true, dataType: “json” }); }, focus: function ( event,ui ){ $( “#myinputbox” ).val( ui.item.value ); return false; […]

升级到jQuery UI 1.10.3后，jQuery的自动完成下拉列表未显示: 在我的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中的自动完成function以手动执行调用（使用自动完成的source: $.ajax {}调用，但仍然没有。有人向我建议问题可能是jQuery改变了导致jquery-ui-rails gem停止工作的东西，但是在向他们提交错误票后，事实certificate这不是问题。任何帮助，将不胜感激。回答说明： mhu的答案是正确的，你应该尽可能避免篡改z-Indexes（这就是为什么我把它标记为正确）。但是在我的情况下（自动填充文本框位于modal dialog中）下拉列表将仅显示在对话框的宽度内（如果文本宽于此值，则隐藏它并且您无法使用滚动条）。因为我不想那样，我做了我在下面的答案中所描述的并且它有效。我确实对自己做了各种评论和注释，以确保它在任何jQueryUI更新后仍然有效。

清除jquery ui自动完成的缓存: 我想我已经阅读了这个问题上的每个stackoverflow和google结果，它们似乎都引用了第一个jquery自动完成插件而不是当前的jquery ui自动完成。强制自动完成结果从数据源而不是缓存列表更新的方法是什么？

使用URL中的JSON进行jQuery UI自动完成: 我正在使用jQuery UI自动完成function。我可以使用jQuery UI提供的示例，如下所示： var availableTags = [ “ActionScript”, “AppleScript”, “Asp”, “BASIC”, “C”, “C++”, “Clojure”, “COBOL”, “ColdFusion”, “Erlang”, “Fortran”, “Groovy”, “Haskell”, “Java”, “JavaScript”, “Lisp”, “Perl”, “PHP”, “Python”, “Ruby”, “Scala”, “Scheme” ]; $(“#tags”).autocomplete({ source: availableTags }); 这没有任何问题。但我需要使用JSON作为我的数据源，可以像这样检索： http：//mysite.local/services/suggest.ashx？query = ball 如果我要去那个URL，我会像这样得到JSON： [{“id”:12,”phrase”:”Ball”},{“id”:16,”phrase”:”Football”},{“id”:17,”phrase”:”Softball”}] 如何使用我的URL作为数据源？我试过像这样更改source-option： $(“#tags”).autocomplete({ source: “http://mysite.local/services/suggest.ashx” }); 但它没有帮助。我猜这个服务不知道在输入字段中输入了哪个关键字？任何指针都会很棒。

jquery ui autocomplete _renderItem似乎干扰了select事件: 如果我使用_renderItem，则我的select事件不起作用。如果我注释掉我调用_renderItem的最后一段代码，则select事件有效。当我使用_renderItem时，select事件根本不会触发。 var cache = {}, lastXhr; $(“#hifind-find”).autocomplete({ source: function(request, response) { var term = request.term; if (term in cache) { response(cache[term]); return; } var posturl = ‘/hifind/jquery_ui/autocomplete/’+term; lastXhr = $.post(posturl, function(data, status, xhr) { cache[term] = data; if (xhr === lastXhr) { response(data); } }, ‘json’); }, delay: 300, minLength: 1, select: function(event, […]

将值设置为jquery自动完成combobox: 我正在使用jquery自动完成combobox ，一切都很好。但我也希望通过JavaScript设置特定值，如$(“#value”).val(“somevalue”)并设置为select元素，但输入元素中没有自动完成更改。当然，我可以直接选择此输入并设置值，但是还有其他一些方法吗？我尝试设置绑定到this.element如this.element.bind(“change”, function(){alert(1)})但它没有效果。我不知道为什么。编辑我发现了这种情况的解决方法。但我不喜欢它。我已经为ui.combobox的_create函数添加了以下代码 this.element.bind(“change”, function() { input.val( $(select).find(“option:selected”).text()); }); 当我需要更改值时，我可以使用$(“#selector”).val(“specificvalue”).trigger(“change”);

使用Jquery UI自动完成function将额外参数传递给源: 我正在尝试使用jQuery UI自动完成function传递城市和州的额外参数。我一直试图找到一个答案，但似乎找不到适合我的东西。我目前的代码是： $(document).ready(function () { $(“#id_place”).autocomplete({ source: function(request, response) { $.ajax({ url: “/autocomplete_place”, dataType: “json”, data: { term: request.term, city: $(“id_city”).val(), state: $(“id_state”).val(), test: 4 }, success: function(data) { response(data); } }); }, }); }); 自动完成function正常，但它没有将我的城市和州参数传递给该function。如果我输入v它请求URL： /autocomplete_place?term=v&test=4 我猜它评估城市和州的val() (document).ready()并获得这些表格字段的空白值？我认为将源代码转换为ajax函数可以解决这个问题，但也许不会。有任何想法吗？

可以更改“jquery UI自动完成”function中传递的默认“术语”名称吗？: 我正在尝试更改默认情况下使用jquery ui自动完成function设置的“term”字段。是否可以轻松地将其更改为“q”（查询）而无需在“核心”文件中更改它？ JavaScript的： $(function() { $( “#spotify_song_search” ).autocomplete({ source: “http://ws.spotify.com/search/1/track.json”, data: { q: request.term }, dataType: “getjson”, minLength: 3, select: function( event, ui ) { alert(‘select’); } }); });