标签: autocomplete

我已经实现了自动完成功能,在选择项目后,我在文本框中遇到标签与值的问题.当我输入邮政编码时,我会在下拉列表中看到标签:

但是在我选择一个,而不是显示在文本框中的标签后,将显示值(即需要保存到数据库的ID):

如何在选择标签后仍然显示标签,但是当保存表单时,它会传递字段的ZipCodeID？

这是我的Controller方法:

public JsonResult FindZipCode(string term)
    {
        VetClinicDataContext db = new VetClinicDataContext();

        var zipCodes = from c in db.ZipCodes
                       where c.ZipCodeNum.ToString().StartsWith(term)
                       select new { value = c.ZipCodeID, label = c.ZipCodeNum};

        return this.Json(zipCodes, JsonRequestBehavior.AllowGet);
    }

这是我的标记:

<script type="text/javascript">
    $(document).ready(function() {
        $("#ZipCodeID").autocomplete({
                  source: '<%= Url.Action("FindZipCode", "Customers") %>',
        });
    });
</script>

<div class="ui-widget"><input type="text" name="ZipCodeID" id="ZipCodeID" /></div>

编辑:这是我的最终工作代码:

控制器:

public JsonResult FindZipCode(string term)
    {
        VetClinicDataContext db = new VetClinicDataContext();

        var zipCodes = from c in db.ZipCodes
                       where c.ZipCodeNum.ToString().StartsWith(term)
                       select new { …

我正在使用_renderItem来修改结果列表

.data( "autocomplete" )._renderItem = function( ul, item ) {
            var temp = item.url.substring(16, item.url.length)
            return $( "<li></li>" )
            .data( "item.autocomplete", item )
            .append( "<a>" + item.value + "<br>" + item.url + "<br>" + item.description + "<br>" + "Support URL: " + item.support_url + "<br>" + "Contact: " + "<a href=" + item.contact + ">Test</a>" + "<br />" + "</a>"  )
            .appendTo( ul )

这具有自动标记任何看起来像url作为href的行为的行为.我想将整个项目作为链接

在较旧的自动完成中,这样做:

 .result(function(event, item) {
   location.href = item.url;
  });

但是这不再需要支持了.

有谁知道我怎么做:

1)使用类似于.result函数的东西,只需将整个项目作为链接
或
2)修改_renderItem,使其不会自动将看起来像URL的字符串转换为href的

谢谢.

我有一个jQuery UI Autocomplete控件,当minLength = 3时触发Ajax请求.问题如下:假设我输入"fic"作为初始搜索词 - 这很好.请求触发并返回结果.我决定不想选择任何结果,然后再次重新输入相同的搜索(fic).这次没有Ajax请求触发!

我的代码如下所示:

// ... do request
$("#reportSearch").autocomplete({
    delay: 50,
    minLength: 3,
    source: function(q, add){
        $.ajaxSetup ({ cache: false});              
        $.ajax({
            type: "GET",
            url: K_URL_REQUEST

所以基本上在上面描述的第二个场景中没有触发"源"回调.似乎这样做的原因是自动完成控件保留在前一个搜索词上,因为它匹配 - 没有触发搜索:

// Taken from jquery-ui-1.8.4.custom.min.js
if (a.term != a.element.val()) { // *** THE MATCH IS HERE
    //console.log("a.term != a.element.val(): "+a.term+", "+a.element.val());
    a.selectedItem = null;
    a.search(null, c) // *** SEARCH IS TRIGGERED HERE
}

为了让它每次都能触发,我只需在搜索返回后将搜索词重置为null.这种方式按预期工作.

事情是我不明白这种行为.我认为每次搜索都应该是截然不同的.没有缓存(或者不应该是缓存).

所以虽然我已经解决了我的问题,但我仍然觉得我在这里错过了一些东西.

任何人的想法？提前致谢!

我正在寻找一种方法来创建一个行为如下的nssearchfield:

• 用户在文本中的类型
• 基于匹配,出现自动完成下拉列表
• 搜索字段中的文本不会自动完成列表中的第一项

关键是,我的字符串匹配搜索文本字段中的任何子字符串和自动完成都不起作用,因为它会覆盖我输入的字符串.事实上,这应该是默认行为,还是我误解了搜索字段的目的？
进一步键入将进一步限制列表,但只有在自动填充下拉列表中选择项目后,该项目才会插入到文本字段中.

如果使用nssearchfield无法完成此操作,还有其他选择吗？

这个问题很容易.在Web应用程序的客户端使自动完成很漂亮很简单.有很多插件.

但是,在服务器端的背面,最好的方法是什么？我不喜欢用用户按下每个按键来击中数据库的想法.

我一直在考虑sphinx,或者从你的网站并行运行的一些全文搜索引擎.

例如,如果我有一个PHP(高流量)网站,我可以创建一个并行python脚本,从我的"自动完成文本框"获取http请求.然后,当用户按下客户端的密钥时,AJAX请求将被定向到可以使用特殊策略的python脚本.

什么是你的方法？

一些惯例:

• 尽量不要打DB.我的意思是,得到请求并做一些SELECT*FROM foo WHERE bar LIKE"req%"不是一个好的答案.这可能是一个很好的策略,但我知道该怎么做.*
• 复制数据可能是一个不错的选择.

我有以下代码:

// Autocomplete search
    $("#shop_search").autocomplete({
      source: '<%= spotify_search_path(:json) %>',
      minLength: 1,
      select: function(event, ui) {
        append_place(ui.item.name, ui.item.id, ui.item.shop_type, ui.item.address_geo, ui.item.contact, ui.item.email, ui.item.web);
        $("#shop_search").val('');
      }
    }).data( "autocomplete" )._renderItem = function( ul, item ) {
      return $( "<li></li>" )
      .data( "item.autocomplete", item )
      .append( "<a>" + "<span class='autocomplete_link'>" + item.name + "</span>" + "<br />" + "<span class='autocomplete_address'>" + item.address_geo + "</span>" + "</a>" )
      .appendTo( ul );

      $(".ui-autocomplete-loading").ajaxStart(function(){
        $(this).show();
      });

      $(".ui-autocomplete-loading").ajaxStop(function(){
        $(this).hide();
      });

    };

目前它只显示搜索结果时的下拉自动完成功能.我想让它显示"找不到匹配项"时找不到任何内容.我应该在代码中添加什么？

谢谢.

如何创建基于字符串过滤文本的自动完成ComboBox或TextBox？

例如:如果我在TextBox中键入"a",我只能看到包含"a"的所有字符串.

我正在尝试使用jQuery UI自动完成实现缓存.我正在使用jQuery 1.4.4和UI 1.8.6

这是我工作的基本代码:

$('#searchbox').autocomplete({
    source: function(request, response) {
            if (xhr === lastXhr) {
                response( $.map(data, function(item) {
                    return {
                        label: item.NAME + (item.PRFNM ? ' (' + item.PRFNM + ')' : '') + ', ' + item.JOBTITLE,
                        value: item.NAME
                    };
                }));
            } 
        });
    }
});

这是我尝试通过查看示例来实现缓存:

var cache = {},
    lastXhr;
$('#searchbox').autocomplete({
    source: function(request, response) {
        var term = request.term;
        if (term in cache) {
            response($.map(cache[term], function(item) {
                return {
                    label: item.NAME + (item.PRFNM ? ' (' + …

我在输入框上有jQuery自动完成设置.

它工作正常.

但是,我希望有一个按钮,单击该按钮将触发自动完成,就像用户在输入中键入一些文本一样.我会传递一个特定的字符串.

有关如何做到这一点的任何想法？

我正在构建一个应用程序,并希望在textarea中进行自动完成,就像Twitter/Facebook如何使用@ [name].但是,当我输入[TID:x]时,我想触发它​​,其中x是任意长度的整数.

看到Twitter/Facebook在您点击@符号后开始自动完成,然后将文本数据发送到自动完成后.有没有人知道jQuery UI插件(或任何其他插件)是否可以做这样的事情？