0

我正在尝试使用 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 请求返回的数据（见下文）不是流沙期望的格式，但我不确定如何从响应中推断相关信息。我的 AJAX 请求的响应类似于：

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

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

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

AJAX 请求工作得很好，但我需要将流沙集成到这里。

我需要：

  • 一个更好的方法来做到这一点，或者；
  • 一种在上述代码中推断 replaceWith() 的参数以用作流沙的目标代码的方法。

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

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

4

1 回答 1

0

如果有人遇到类似的问题，以下在 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>
于 2012-04-19T08:23:41.580 回答