资讯专栏INFORMATION COLUMN

typehead ajax format relay

laoLiueizo / 2139人阅读

摘要:异步搜索提示的实现异步搜索没有查询到相关的记录

异步搜索提示的实现

/**
 * 异步搜索
 * @type {Bloodhound}
 */
var bestPictures = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace("data"),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: GUI.data.API.searchUser,
        rateLimitWait: 700,
        prepare: function(query, settings) {
            console.log(query);
            settings.type = "POST";
            settings.contentType = "application/x-www-form-urlencoded; charset=UTF-8";
            settings.data = {
                keyName: query
            };

            return settings;
        },
        transform: function(response){
          console.log(response);
          return response.data
        }
    }
});

$("#the-basics .typeahead").typeahead(null, {
    name: "best-pictures",
    limit: "11",
    display: "data",
    source: bestPictures,
    templates: {
      empty: [
          "
", "没有查询到相关的记录", "
" ].join(" "), suggestion: Handlebars.compile("
{{name}} {{deptName}}
") } });

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/103916.html

相关文章

  • 使用Bootstrap typeahead插件实现搜索框自动补全的配置参数。

    摘要:示例代码需求通过输入地名自动补全地址信息,选择提示信息后,讲地址经纬度附值给隐藏的,后提交表单。 示例代码: API:http://wiki.openstreetmap.org/wiki/Nominatim 需求:通过输入地名自动补全地址信息,选择提示信息后,讲地址经纬度附值给隐藏的input,后提交表单。 var suggestion_source = new Bloodh...

    JerryC 评论0 收藏0
  • 翻译 | React AJAX最佳实践

    摘要:作者沪江前端开发工程师本文原创翻译,有不当的地方欢迎指出。管理数据,而提供服务器上的数据,因此应用于处理网络请求。结论使用建立的应用都是模块化的会成为其中一个模块,库是另一个模块。原文原创新书移动前端高效开发实战已在亚马逊京东当当开售。 作者:Oral (沪江Web前端开发工程师)本文原创翻译,有不当的地方欢迎指出。转载请指明出处。 当你问起有关AJAX与React时,老司机们首先就会...

    DirtyMind 评论0 收藏0
  • react如何和server交互

    摘要:在一个应用中,如何通过和端进行交互这个问题曾经困扰了我一段时间,经过学习实践,有了一点心得体会,写出来和大家分享一下。组件和一样,和进行交互,将获取的通过向下传递给组件。不足被设计用来和服务器一起运行,并不能很好的和第三方服务交互。 在一个react应用中,如何通过ajax和server端进行交互这个问题曾经困扰了我一段时间,经过学习实践,有了一点心得体会,写出来和大家分享一下。 总的...

    1treeS 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<