Question

我正在尝试使用Quicksand jQuery插件来装饰Rails中AJAX调用的响应：

链接：

<% Project.services.each_with_index do |service, index| %>
  <%= link_to_function(service, "regatherProjects('#{service}', #{index})", :id => "service_link_#{index}") %>
  <%= " / " if !index.eql?(Project.services.length - 1) %>
<% end %>

JS：

function regatherProjects(service_name, service_id) {
  $.get("/index_project_update", { service: service_name }, function(data) {
    $('#home_projects').quicksand($(data), {
      adjustHeight: 'dynamic'
    });
  });
  $('#home_services').find('a').removeClass("on");
  $('#service_link_' + service_id).addClass("on");
};

控制器：

def index_project_update
  if params[:service] && !params[:service].blank?
    @projects = Project.highlighted.where(:service => params[:service])
  else
    @projects = Project.highlighted
  end
end

查看：

$("#home_projects").replaceWith("<%= j(render('projects')) %>")

项目：

<div id="home_projects">
  <% if @projects.empty? %>
    <p>No projects. <%= link_to_function("View All", "regatherProjects('')") %>.</p>
  <% else %>
   <ul class="all_projects">
     <% @projects.each_with_index do |project, index| %>
       <li data-id="<%= project.customer.name.underscore.downcase %>_<%= project.name.underscore.downcase %>">
       <%= link_to(image_tag(project.project_images.first.image.home), project) %>
       </li>
     <% end %>
   </ul>
  <% end %>
</div>

我认为问题是AJAX请求返回的数据（见下文）不是Quicksand预期的格式，但我不确定如何推断相关来自回复的信息。我的AJAX请求的响应类似于：

$("#home_projects").replaceWith("<some><html><that><i><need>")

所以，问题是当它应该使用替换HTML时，它使用上面的代码作为Quicksand调用的目标代码：

<some><html><that><i><need>

AJAX请求完全正常，但我需要将Quicksand集成到这里。

我需要：

更好的方法，或者;
一种在上述代码中推断replaceWith（）的参数以用作Quicksand的目标代码的方法。

如果我遗漏了您认为需要帮助的任何信息，请询问。

这是我在Stack Overflow上提出的第一个问题，所以我觉得有义务为任何误解道歉。

Answer 1

如果有人遇到类似的问题，以下内容适用于Chrome，Firefox，IE9，IE8和IE7。

链接：

<% Project.services.each_with_index do |service, index| %>
  <%= link_to_function(service, "regatherProjects('#{service}', #{index})", :id => "service_link_#{index}") %>
  <%= " / " if !index.eql?(Project.services.length - 1) %>
<% end %>

JS：

function regatherProjects(service_name, service_id) {
  $.get("/index_project_update.html", { service: service_name }, function(data) {
    $('.all_projects').quicksand($(data).find('li'), {
      adjustHeight: 'dynamic'
    });
  });
  $('#home_services').find('a').removeClass("on");
  $('#service_link_' + service_id).addClass("on");
};

路线：

match '/index_project_update' => 'application#index_project_update', :defaults => { :format => 'html' }

控制器：

def index_project_update
  if params[:service] && !params[:service].blank?
    @projects = Project.highlighted.where(:service => params[:service])
  else
    @projects = Project.highlighted
  end
  render :layout => false
end

查看：

<%= render('application/index/projects') %>

项目：

<div id="home_projects">
  <% if @projects.empty? %>
    <ul class="all_projects">
      <li data-id="project">No projects. <%= link_to_function("View All", "regatherProjects('')") %>.</li>
    </ul>
  <% else %>
    <ul class="all_projects">
      <% @projects.each_with_index do |project, index| %>
         <li data-id="project_<%= project.id %>">
           <%= link_to(image_tag(project.project_images.first.image.home, :alt => (project.customer.name + " - " + project.name), :title => (project.customer.name + " - " + project.name)), project) %>
         </li>
      <% end %>
    </ul>
  <% end %>
</div>

如何在Rails AJAX请求中使用Quicksand jQuery插件？

1 个答案: