Twitter的引导预输入2.0.4 Ajax错误 [英] twitter bootstrap typeahead 2.0.4 ajax error

查看:119
本文介绍了Twitter的引导预输入2.0.4 Ajax错误的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有以下的code这无疑会返回一个适当的数据结果,如果我用的是2.0.0版本,但由于某些原因引导的预输入的插件是给我一个错误。我贴吧code示例如下:

 <输入ID =测试类型=文本/>

$('#测试)。预输入({
    来源:功能(键盘缓冲,查询){
        返回.post的$('/资料/ searchFor',{查询:查询},功能(数据){
            返回typeahead.process(数据);
        });
    }
});
 

当我运行这个例子中,我得到一个jQuery的错误,上面写着以下内容:

  **
产品未定义
匹配(项目=未定义)bootst ... head.js(线104)
< BR />(?)(项目=未定义)bootst ... head.js(线91)
< BR /> F(A =()的函数,B =()的函数,C = FALSE)jQuery的.... min.js(2号线)
< BR />查找(事件=未定义)bootst ... head.js(线90)
< BR /> KEYUP(E = {对象= originalEvent事件KEYUP,TYPE =KEYUP和TIMESTAMP = 145718131,更多...})bootst ... head.js(线198)
< BR /> F()的jQuery .... min.js(2号线)
< BR />添加(C =对象{originalEvent =事件KeyUp,TYPE =KEYUP和TIMESTAMP = 145718131,< BR />更多...})jQuery的.... min.js(3号线)
< BR />添加(A = KEYUP字符code = 0,关键code = 70)的jQuery .... min.js(3号线)
< BR />打破这个错误]
< BR />返回item.toLowerCase()的indexOf(this.query.toLowerCase())**。
 

有什么想法? ......同样的code工作在2.0.0版本的插件,但没有写信给我敲除的对象​​模型。

这是工作预输入code为2.0.0版本:

  VAR searchFunction =功能(预输入,查询){
        $阿贾克斯({
            网址:?/资料/ searchFor tableName值=+ tableName值+&放大器;查询=+查询+&放大器; extendedData =+ $(#+ extendedData).VAL()
            成功:功能(数据){
                如果(data.errorText!= NULL){
                    toggleLoading(假);
                    的ShowDialog(data.errorText,错误);
                    返回;
                }
                VAR的结果= data.results.split(::);
                typeahead.process(结果);
            },
            选择:功能(事件,UI){
            }
        });
    }

    $(#+ inputBoxId).typeahead({
        来源:searchFunction,
        ONSELECT:函数(OBJ){
        }
    });
 

解决方案

1)引导预输入V2.0.2解决方案

看看这个拉申请,它看起来像你在找什么对(它从引导预输入V2.0.2叉)。

我用它自己,它的工作:)

2)引导预输入v.2.1.0 - 正在进行的工作解决方案

你也可以尝试这个解决方案。我只是改变了我的项目使用这一块,becouse这会是在未来的版本支持,它看起来更清洁的:)

在我的情况:

  $(#预输入)。预输入({
  来源:功能(查询,进程){
    .post的$('url_path',{Q:查询,限制:4},功能(数据){
      处理(数据);
    }); //后结束
  }
});
 

如果脚本 url_path requiers 2个参数问:(串)和限制(结果限制),并返回JSON响应(阵列):

为例响应查询的有限制的 4

  

[阿姆,软绵绵的Bizkit,蕾哈娜,威尔·史密斯]

I have the following code which definitely returns a proper data result if I use the 2.0.0 version, but for some reason bootstrap's typeahead plugin is giving me an error. I pasted it below the code sample:

<input id="test" type="text" />

$('#test').typeahead({
    source: function(typeahead, query) {
        return $.post('/Profile/searchFor', { query: query }, function(data) {                
            return typeahead.process(data);
        });
    }
});

When I run this example I'm getting a jQuery bug that says the following:

**
item is undefined
matcher(item=undefined)bootst...head.js (line 104)
<br/>(?)(item=undefined)bootst...head.js (line 91)
<br/>f(a=function(), b=function(), c=false)jquery....min.js (line 2)
<br/>lookup(event=undefined)bootst...head.js (line 90)
<br/>keyup(e=Object { originalEvent=Event keyup, type="keyup", timeStamp=145718131, more...})bootst...head.js (line 198)
<br/>f()jquery....min.js (line 2)
<br/>add(c=Object { originalEvent=Event keyup, type="keyup", timeStamp=145718131, <br/>more...})jquery....min.js (line 3)
<br/>add(a=keyup charCode=0, keyCode=70)jquery....min.js (line 3)
<br/>[Break On This Error]  
<br/>return item.toLowerCase().indexOf(this.query.toLowerCase())**

Any thoughts? ... The same code works in the 2.0.0 version of the plugin, but fails to write to my knockout object model.

THIS IS WORKING TYPEAHEAD CODE FOR the 2.0.0 version:

var searchFunction = function(typeahead, query) {
        $.ajax({
            url: "/Profile/searchFor?tableName=" + tableName + "&query=" + query + "&extendedData=" + $("#" + extendedData).val(),
            success: function(data) {
                if (data.errorText != null) {
                    toggleLoading("false");
                    showDialog(data.errorText, "Error");
                    return;
                }                
                var result = data.results.split("::");
                typeahead.process(result);
            },
            select: function(event, ui) {
            }
        });
    }

    $("#" + inputBoxId).typeahead({
        source: searchFunction,
        onselect: function(obj) {
        }
    });

解决方案

1) Bootstrap typeahead v2.0.2 solution

have a look at this pull request, it looks like what you're looking for (its a fork from bootstrap typeahead v2.0.2).

I use it myself and it's working :)

2) Bootstrap typeahead v.2.1.0-work in progress solution

Also you can try this solution. I just changed my project to use this one, becouse it's gonna be supported in future versions and it looks cleaner :)

In my case:

$("#typeahead").typeahead({
  source: function(query, process) {
    $.post('url_path', { q: query, limit: 4 }, function(data) {
      process(data);
    }); // end of post
  }
});

Where script url_path requiers 2 arguments q (string) and limit (results limit) and returns json response (array):

Example response to query i with limit 4:

["Eminem","Limp Bizkit","Rihanna","Will Smith"]

这篇关于Twitter的引导预输入2.0.4 Ajax错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆