搜索,使用AJAX排序

时间:2011-08-26 07:43:31

标签: ajax ruby-on-rails-3 search sorting jquery

我已经从RailsCasts剧集240中复制了代码。我不知道为什么使用此代码Ajax请求不起作用。搜索功能可以使用普通方法(重新加载页面),而不是通过Ajax。排序功能根本不起作用。

我已经包含以下JavaScript库:

  • 的application.js
  • jQuery JavaScript Library v1.6.2
  • jQuery UI 1.8.15
  • jQuery.rails.js
  • jQuery TinySort v1.1.0

如果您需要更多信息,请告诉我们。我希望你能帮我解决问题。

users_controller.rb

def index
  @users = User.search(params[:search]).order(sort_column + " " + sort_direction)

  respond_to do |format|
    format.html # index.html.erb
    format.xml  { render :xml => @users }
  end
end

def sort_column
  User.column_names.include?(params[:sort]) ? params[:sort] : "lastname"
end

def sort_direction
  %w[asc desc].include?(params[:direction]) ? params[:direction] : "asc"
end

index.html.erb

<h1>Listing users</h1>

<%= form_tag users_path, :method => 'get', :id => "users_search" do %>
  <p>
    <%= text_field_tag :search, params[:search] %>
    <%= submit_tag "Search", :name => nil %>
  </p>
  <div id="users">
    <%= render 'users' %>
  </div>
<% end %>

_users.html.erb

<%= hidden_field_tag :direction, params[:direction] %>
<%= hidden_field_tag :sort, params[:sort] %>
<table class="pretty">
  <tr>
    <th><%= sortable "Last name" %></th>
    <th><%= sortable "First name" %></th>
  </tr>
  <% for user in @users %>
    <tr>
      <td><%= user.lastname %></td>
      <td><%= user.firstname %></td>
    </tr>
  <% end %>
</table>

index.js.erb的

$("#users").html("<%= escape_javascript(render("users")) %>");

users_helper.rb

def sortable(column, title = nil)
  title ||= column.titleize
  css_class = column == sort_column ? "current #{sort_direction}" : nil
  direction = column == sort_column && sort_direction == "asc" ? "desc" : "asc"
  link_to title, params.merge(:sort => column, :direction => direction, :page => nil), {:class => css_class}
end

的application.js

$(function() {
  $("#users th a").live("click", function() {
    $.getScript(this.href);
    return false;
  });
  $("#users_search input").keyup(function() {
    $.get($("#users_search").attr("action"), $("#users_search").serialize(), null,     "script");
    return false;
  });
});

感谢您的帮助!

1 个答案:

答案 0 :(得分:2)

要使上述代码生效,您必须删除以下代码行。

respond_to do |format|
  format.html # index.html.erb
  format.xml  { render :xml => @users }
end

现在它有效。 : - )