快速输入结果格式 [英] Typeahead result formatting

查看:78
本文介绍了快速输入结果格式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

尝试使用Typeahead并在JSON格式(我无法控制)中苦苦挣扎.

Trying to use Typeahead and struggling with JSON formatting (which I have no control over).

{ name="Long Island", type="2", id="1234"}

这是我的JS

$autocomplete.typeahead({
name: 'location',
remote: {
    url: 'http://pathtomysite.com/%QUERY?',
    dataType: 'jsonp',
    filter: function (parsedResponse) {
        console.log(parsedResponse);
        return parsedResponse;
    }
},
template: [
    '<p class="repo-name">{{name}}</p>',
    '<p class="repo-description">{{id}}</p>'
].join(''),
engine: Hogan

});

因此请求有效,并且它在控制台中返回了对象,但是预先输入的可视下拉列表仅显示未定义".

So the request works and it returns objects in the console, but the typeahead visual dropdown just says 'undefined'.

所以我想我需要对基准点做些什么?

So I am guessing I need to do something with datums?

我尝试过使用Hogan模板,但是下拉菜单中没有任何内容.

I've tried using Hogan templating but nothing is appearing in the drop down.

不确定JSONP是否是这个问题?该请求中包含大量字符,请参见JS标签 http://jsbin.com/aPOZohi/1/edit

Not sure if JSONP is this issue? The request has a load of characters prepended, see the JS tab http://jsbin.com/aPOZohi/1/edit

是的,我要去哪里错了?

So yeah, where am I going wrong?

一旦我得到它返回的数据,我还有另一个格式问题:)

Once I get it returning data, I have another formatting question for you :)

推荐答案

@Xeevis的答案几乎是正确的.

@Xeevis's answer is almost correct.

首先:很多字符前置"是jQuery在进行跨域请求时内部执行JSONP的方式.

First: the "many characters prepended" are jQuery's way of doing JSONP internally when doing cross-domain request.

第二个:Xeevis是正确的,问题出在valueKey上,而不仅仅是valueKey.响应必须是一个对象数组,每个对象包含一个由valueKey指定的名称的成员.因此,将valueKey设置为"name",还要返回一个数组:

Second: Xeevis is right, the problem is valueKey, but not only valueKey. The response has to be an array of object, each containing a member by the name specified by valueKey. So set valueKey to "name", but also return an array:

filter: function (parsedResponse) {
    console.log(parsedResponse);
    return parsedResponse.locations;
}

这篇关于快速输入结果格式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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