Rails 4, AJAX, js.erb, отсутствующий шаблон

Question

Я пытаюсь получить представление о создании AJAX шаблона на индексной странице. Может ли кто-нибудь помочь мне понять, как Rails отображает «next.js.erb», а не ищет «next.html.erb»?

routes.rb

get 'index' => 'products#index' 
get 'next' => 'products#next' 

index.html.erb

<%= @products.first.price %> 
<%= link_to "Next", action:"next", remote: true %> 
<div class="box"></div> 

next.js.erb

(".box").html(<%= j render("nextitem") %> 

_nextitem.html.erb

<%= @products.second.price %> 

В products_controller.rb:

def index 
    @products = Product.all 
end 

def next 
    @products = Product.all 
    respond_to do |format| 
     format.html { redirect_to root_path } 
     format.js 
    end 
end 

Answer 1

Я хотел бы начать с добавлением маршрута ресурсов на ваш routes.rb страницы вместо того, чтобы указать каждый уникальный маршрут:

resources :products, only: [:index] do 
    member do 
     post 'next' 
    end 
end 

Затем ссылка вашего index.html.erb страницы может выглядеть следующим образом:

<%= link_to "Next", next_product_path(@product), remote: true %> 

Ваш products_controller.rb необходимо указать конкретный @product в методе def next, который вы можете извлечь из своей коллекции @products (вы можете найти последний продукт, который вы отображали, и получить nex t one, или, как вы хотите это сделать).

next.js.erb можете сделать это (при наличии которой _next_item.html.erb частичное, передавая переменную @product экземпляра, определенный в контроллере в качестве локальной переменной с именем product):

$(".box").html("<%= j render 'nextitem', product: @product %>"); 

И, наконец, в _nextitem.html.erb вы можете просто отформатировать product локальная переменная, но вы хотите ее в html до ее рендеринга и заменяет то, что у вас есть на вашей странице, то есть:

<div><%= product.price %></div> 

Пожалуйста, дайте мне знать, если у вас есть какие-либо вопросы или если что-то еще недостаточно ясно!

-Dave

Answer 2

Изменение next.js.erb к этому:

$(".box").html("<%=j render 'nextitem ' %>") 

Answer 3

Если вы просто запросить страницу в /next, он будет искать html.erb шаблона. Чтобы сделать шаблон js, вам необходимо добавить .js в конце запроса, например localhost:3000/next.js. И то же самое верно для ответа JSON. Для ответа JSON вам нужно добавить .json в конце URL-адреса.

Или, если вы используете jQuery для получения ответа от сервера, вам необходимо передать dataType: script для отображения формата JS вместо HTML-формата.