2016-02-07 3 views
1

В приложении для блога я хочу, чтобы кнопка Next Comment отображала следующий (экземпляр) комментарий после того, как пользователь нажимает на него.Передний вызов Ruby on Rails

У меня есть метод, определенный и работающий в модели Comment, поэтому мой вопрос ориентирован на интерфейс.

  • Как динамически отображать последний комментарий? Смысл, что рельсы знают, какой комментарий есть, и поэтому он может отображать следующий комментарий в строке.

  • Как создать его в элементе %comment html? (AJAX?)

welcome#index:

- @articles.each do |article| 
     .article 
      %comment= article.comments.last.text 
      = link_to "Next Comment", welcome_next_comment_path 

welcome_controller:

class WelcomeController < ApplicationController 

def index 
    ... 
end 

def next_comment 
    find_comment 
    article.comments.next(@comment) 
end 

private 

def find_comment 
    ... 
end 
end 

ответ

1

Я не проверял, но он должен работать (давать или принимать несколько опечаток). По крайней мере, это поможет вам выполнить то, что вы пожелаете.

Ваша ссылка Next Comment имеет текущий идентификатор комментария, который передается при нажатии на него в jQuery/ajax. Метод ajax предотвращает поведение по умолчанию для посещения ссылки и извлекает точную часть страницы html, которую вы ищете (комментарий на странице), и добавляет ее в контейнер ссылки, которую вы нажали.

# app/controllers/welcome_controller.rb 
    def next_comment 
    find_comment 
    @next_comment = article.comments.next(@comment) 
    end 


# app/views/welcome/next_comment.haml 
#comment 
    .article{id: "comment#{@next_comment.id}"} 
    %comment= @next_comment.text 
    = link_to "Next Comment", welcome_next_comment_path, data: {id: @next_comment.id, hook: 'comment-link'} 


# your_view.haml 
- @articles.each do |article| 
    - comment = article.comments.last 
    .article{id: "comment#{comment.id}"} 
    %comment= comment.text 
    = link_to "Next Comment", welcome_next_comment_path, data: {id: comment.id, hook: 'comment-link'} 


# app/assets/javascripts/application.js 
$("[data-hook='comment-link']").click(function(event)) { 
    event.preventDefault(); 
    var url = $(this).attr('href'); 
    var id = $(this).data('id'); 
    var container = $('#comment' + id); 
    $.ajax({ 
    type: 'GET', 
    url: url, 
    success: function(html) { 
     container.append($('#comment', html)) 
    } 
    }); 
});