обновление элемента div с помощью jQuery в приложении Rails 3

Question

У меня есть приложение rails 3, которое использует resque для запуска долго выполняющихся заданий в фоновом режиме, и я хочу создать представление результатов на другой странице

На данный момент у меня работает этот сценарий

Resque запускает задание и записывает информацию в базу данных (обновляет запись информации) по мере ее выполнения. По завершении задания он обновляет одну из записей базы данных, т. Е. Устанавливает complete = 1 (complete создается со значением 0)

ДБ схема

create_table "refreshes", :force => true do |t|
    t.string   "name"
    t.string   "info"
    t.integer  "complete"
    t.datetime "created_at"
    t.datetime "updated_at"
end

Другое представление страницы в приложении будет отображать запись базы данных, вызывая ее контроллер и отображая последние данные на странице. Это представление имеет фрагмент логики для вставки стандартного элемента обновления JavaScript, если полное значение в базе данных не равно 1

view.html.erb

<% if  @refreshes.complete == 0 %>
 <meta http-equiv='refresh' content='5'>
<%end%>

<div id="data">
<p>
    <b>Name:</b>
    <%= @refreshes.name %>
</p>
<p>
    <b>Info:</b>
    <%= @refreshes.info %>
</p>
</div>

Метод контроллера

def view
    @refreshes = Refresh..find(params[:id])

    respond_to do |format|
      format.html # view.html.erb
      format.xml  { render :xml => @refreshes }
    end
end

все это работает нормально, но он выполняет полную перезагрузку страницы каждые 5 секунд, когда для параметра complete задано значение 0, и я хочу просто обновить div, отображающий данные (div id = data), без обновления всего стр.

Я думаю, что это можно сделать с помощью jquery и некоторого JavaScript, но я не могу найти способ сделать это, так может кто-нибудь помочь? Или даже если вы можете указать мне направление, я был бы признателен ура Майк

Answer 1

Да, это можно сделать с помощью JavaScript. Один подход будет

1. Чтобы обновить div каждые n минут, вы можете использовать метод setInterval для вызова функции каждые n миллисекунд.
2. Эта функция должна сделать ajax-запрос для получения данных с сервера и вставки данных в HTML.

Ниже в коде используется jQuery, но вы можете использовать любую другую библиотеку для получения результата.

    $(document).ready(function() {
        // get data every 5 mins and refresh myDiv
        var pingAfter = 5000;  
        var refreshId = setInterval(function() {
            $("#myDiv").load('/partial/data');
        }, pingAfter);
    });

brightcherry.co.uk сайт имеет пример кода для достижения того же.

Answer 2

С помощью Jquery вы можете сделать ajax-вызов, который можно вызывать снова и снова, используя таймер

application.js вызывать эту функцию по нажатию кнопки или при запуске фонового задания

updateDiv = function(){
$.ajax{
 url:'/controller/view.js?paramid='+id+'so..on='+so..on,
 method:get,
 success:function(){
  if (data.complete==1){
   //stop this
  }else{
   setInterval(updateDiv,5000);
  }
 }

Внутри вашего контроллера :::

def view
 //logic to find param
 render do|f|
  f.html
  f.js
 end
end

view.js.erb

#create a partial that can be rendered inside div 'data'
$('#data').render(<% partial %>);
or 
$('#data').html();