Question

在我的视图中添加ajax时，我一直在关注RailsCasts＃240。基本上，我现在正在运行的问题是，当我对表列进行排序或转到索引的下一页时，url仍然在变化。我跟着铁轨完全跟进，不知道我做错了什么。有没有人有任何想法？

的application.js

//= require jquery
//= require jquery_ujs

$(function() {
  $("#network th a, #network .pagination a").live("click", function() {
    $.getScript(this.href);
    return false;
  });
});

index.html.erb

<h1>Network</h1>

<div class ="network">
  <div class="network-body">

    <div id="network"><%= render 'network' %></div>

  </div>
</div>

<br>

index.js.erb的

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

的Gemfile

source 'https://rubygems.org'
ruby '2.1.2'


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.1.4'
# Use sqlite3 as the database for Active Record
group :development do
  gem 'sqlite3'
end
# Use SCSS for stylesheets
gem 'sass-rails', '~> 4.0.3'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.0.0'
gem 'jquery-rails', '>= 3.0.4'
gem 'turbolinks', '>= 1.1.1'
gem 'jbuilder', '~> 2.0'
gem 'bcrypt', '~> 3.1.7'
gem 'devise', '~> 3.3.0'
gem 'orm_adapter', '~> 0.5.0'
gem 'warden', '~> 1.2.3'
gem 'protected_attributes', '~> 1.0.8'
gem 'simple_form', '~> 3.0.2'
gem 'will_paginate', '~>3.0.7'
gem 'bootstrap-will_paginate', '~> 0.0.10'
gem 'ancestry', '~> 2.1'
gem 'whenever', require: false
gem 'geocoder', '~> 1.2'

group :doc do
  gem 'sdoc', '~> 0.4.0', require: false
end

group :production do
  gem 'pg', '~> 0.17.1'
  gem 'rails_12factor', '~> 0.0.2'
end

Answer 1

$(document).on('click', '#network th a, #network .pagination a', function(){
  $.ajax({
    'type': 'get',
    'dataType': 'script',
    'url': this.href,
    'data': {
      // params you want to send to the server
    }
  })
  .complete(function(return_value){
    alert('something!');
    // completed
  });
});

这通常是我对AJAX的看法，因为你可以对进出的内容进行细致的控制。

在你的情况下，既然你正在使用index.js.erb文件，我们可以做得更好，并使用rails'内置的不显眼的js（那就是你在application.js中看到的jquery_ujs文件）

在您的链接上添加remote: true。（home_index_path是您在路线中设置的任何内容）

<%= link_to 'something', home_index_path, remote: true %>

您的渲染'网络'两次......不确定您是否想这样做。无论如何......该链接将（在这种情况下）传递给家庭控制器和索引操作。 remote: true告诉它用js回复。因此，在该操作中，您必须有一个格式块：

respond_to do |format|
  format.html { # html response }
  format.js { # js response # you might need layout: false here if too much is being rendered }
end

使用'responder'gem也很漂亮（这是rails 4.1中的默认行为，但它是rails 4.2的一个宝石）。这使您可以定义操作在控制器顶部响应的内容，然后在操作中定义respond_with。无论如何，一旦这个动作响应了js，它就会找到你所拥有的js.erb文件：

$("#network").html("<%= j render partial: 'home/network' %>");

escape_javascript(render())可以缩写为j render，而调用partial可以让你在其中抛出其他内容，例如集合或区域设置。这将构建模板（以下划线开头！）并将其转储到#network元素中。它不会重新加载页面，也不会更改地址栏。

希望这不是太多了......我开始使用rails的UJS，并开始使用.ajax，因为我对原始的js / coffee变得更加舒服。这里有一些阅读能让你朝着正确的方向前进。

http://guides.rubyonrails.org/layouts_and_rendering.html阅读有关渲染的更多信息

http://edgeguides.rubyonrails.org/working_with_javascript_in_rails.html阅读有关ujs的信息

Ajax网址仍在改变

1 个答案: