我是靠谱客的博主 壮观发夹,这篇文章主要介绍At.js的使用,现在分享给大家,希望可以做个参考。

At.js实现在文本框中的搜索功能

rails中使用简介

1、加入必要的js和css

jquery.atwho.js

jquery.caret.js

jquery.atwho.css

2、

$(function(){
    $('#article_title').atwho({
      at: "",
      tpl: "<li data-value='${title}'>${title}</li>",
      limit: 10,
      callbacks: {
        remote_filter: function(query, callback) {
          $.getJSON( $.routes('api_articles_path'), {keyword: query }, function(data) {
            callback(data);
          });
        }
      }
    });  
});

其中$.getJSON是对路径的转换

'<% url = Rails.application.routes.url_helpers %>'


routes_table = [
  {
    as: 'api_articles_path'
    url: '<%= url.api_articles_path %>'
  }


]


get_routes = (as) ->
  (route for route in routes_table when route.as is as)[0].url


jQuery.extend({
  routes: get_routes
})

3、后台controller

   def api
        @articles = Article.where('title like ?',"%#{params[:keyword]}%").limit(10)
        render json: @articles.to_json(only: [:title])
    end


最后

以上就是壮观发夹最近收集整理的关于At.js的使用的全部内容,更多相关At.js内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(128)

评论列表共有 0 条评论

立即
投稿
返回
顶部