标签: jquery-ui-autocomplete

我一直在那里搜索,只是没有看到有人这样做 - 是否有可能有一些带有jQuery UI自动完成的微调器/加载器？(1.8)在获取数据的同时？

我有一个输入.我使用Jquery UI自动完成功能向用户提出建议.让我的列表中的图像有3项:item1,item2,item3.我要找的是当用户点击进入时要关闭的列表.例如,如果用户只输入"it",则将显示所有3个元素.在那种情况下,如果他点击进入,我希望该列表被关闭.我无法为此解决问题.希望有人能提供帮助.干杯.渣.

http://jsfiddle.net/vXMDR/

我的HTML:

<input id="search" type="input" />?

我的js:

$(function() {

    var availableTags = [
            "item1","item2","item3"
        ];

    $("#search").autocomplete({
        source:availableTags,
        minLength: 0
        });
});?

我们正在从bassistance.de自动完成到jQuery UI自动完成.我找不到jQuery UI版本的那么多例子,文档看起来有点稀疏.那可能只是我.

我想知道是否有人有一个示例/教程解释如何改变自动完成下拉列表的外观.我的代码如下:

$( "#SearchInput" ).autocomplete({
    source: function( request, response ) {
        $.ajax({
            url: "http://servername/index.pl",
            dataType: "json",
            data: {
                term: request.term
            },
            success: function( data ) {
                response( $.map( data.items, function( item ) {
                    return {
                        label: item.id + " - " + item.label,
                        value: item.id
                    }
                }));
            }
        });
    },
});

这有效,我得到的ID和标签显示为连字符分隔.理想情况下,我想知道如何格式化结果的显示方式.我希望ID下面的ID标签.如果可能的话,我想知道如何在文本右侧显示图像.

如果有人对如何实现这一点有任何指示我会很高兴.

尝试使用类别获取jQuery自动完成功能,将选定的值返回到搜索字段,将值返回到单独的输入字段.

我已将数据修改为具有值以及标签和类别.

见http://jsfiddle.net/chrisk/bM7ck/

但是值始终返回到搜索字段而不是标签.

live()方法回答了这个问题,但是从jQuery 1.7开始不推荐使用live()方法,并用.on()方法替换,这个答案对on()不起作用.

以下是之前的答案: 使用.live()绑定jQuery UI自动完成

任何人都知道如何用on()做同样的事情？

如果您将语法更改为类似的

$(document).on("keydown.autocomplete",[selector],function(){...});

从

$([selector]).live("keydown.autocomplete",function(){...});

它有点工作,但它以一种奇怪的方式与内部自动完成事件交互.使用live(),如果使用select事件并访问event.target,它将为您提供input元素的id.如果你使用on(),它会给你下拉菜单"ui-active-menuitem"的id.像这样的东西:

$( ".selector" ).autocomplete({
   select: function(event, ui) { 
     console.log(event.target.id);
 }
});

但是 - 如果您使用"开放"事件,它将为您提供我正在寻找的ID - 只是不在正确的时间(我选择它后需要它).此时,我正在使用一种解决方法,即在open事件函数中获取input元素的ID,将其存储在隐藏字段中,然后在我需要的select方法中访问它.

我需要有关jquery的aucomplete的帮助.

jQuery("#PeopleName").autocomplete(
                                   {source:["name1","name2","..."],
                                    minLength:2,
                                    max:10,
                                    scroll:true});

'scroll'和'max'不起作用.
我使用的是jquery-ui-1.8.18.custom.min.js.这段代码有什么问题？

使用jquery ui autocomplete 组合框时,可以为组合框设置默认值吗？

有没有人知道jquery-ui自动完成插件的轻量级替代品？

我没有在项目中使用任何其他jquery-ui组件(基础库是jquery 1.5.2).因此,我觉得我无法在单个搜索字段上为简单的自动完成添加20k(缩小).

目前可能的选择是:

https://github.com/agarzola/jQueryAutocompletePlugin

http://code.google.com/p/jquery-autocomplete/

我不想为这样的标准功能推出自己的插件..当然必须有一个很好的解决方案吗？

我正在使用jQuery Autocomplete来搜索城市的本地数据库.这是代码:

$('#txt_search_city').autocomplete({
    source: url,
    delay: 0,
    autoFocus: true,
    select: function( event, ui ) {
        $( "#id_city" ).val( ui.item.id );
        $(this).closest('form').submit();
    },
    focus: function( event, ui ) { event.preventDefault(); }
});

我希望默认情况下选择第一个返回值(就像在facebook上一样).所以基本上,如果他们只是点击输入,他们将触发第一个结果的选择.

我认为那是做了什么autoFocus: true,但它不起作用.没有显示错误,只是没有选择第一个结果.

思考？

调节器

public ActionResult Search(string id)
{
     id= Request.QueryString["term"];         
     var routeList = db.Movies.Where(r => r.Title.Contains(id))
                   .Take(5)
                   .Select(r => new { id = r.MovieID, label = r.Title, name = "MovieID" });
     return Json(routeList, JsonRequestBehavior.AllowGet);
}

视图:

<input type="hidden"   id="MovieID"  name="MovieID" />
<input type="text" id="SelectedMovie" value=""/>
<script type="text/javascript" language="javascript">
   $("#SelectedMovie").autocomplete({
       source: function (request, response) {
           $.ajax({
              url: "/Transaction/Search", type: "POST", dataType: "json",                        
              data: { id: request.term }, 
              success: function (data) {
              response($.map(data, function (item) {                                
                return { label: item.label, value: item.id }; //updated …