Rails 3 - рендеринг частичного при вызове ajax во всплывающем окне

Question

У меня есть кнопка с remote => true, которая вызывает всплывающее окно (всплывающее окно jquery, а не реальное) следующим образом:

$modal = $('#modal')
$modal_close = $modal.find('.close')
$modal_container = $('#modal-container')
$task_select_div = $('.activity_task_add')

# Handle modal links with the data-remote attribute
$('a[data-remote]').on 'ajax:success',  (xhr, data, status) ->
  $modal
    .html(data)
    .prepend($modal_close)
    .css('top', $(window).scrollTop() + 150)
    .show()

#This is the callback that is not being executed.
$('form[data-remote]').on 'ajax:success',  (xhr, data, status) ->
  alert(data)
  $modal_container.hide()
  $modal.hide()
  $task_select_div.html(data)

В этом всплывающем окне у меня есть другая форма с remote_tag в кнопке отправки этой формы, которую я вызываю, и действие, которое имеет следующий код внизу:

respond_to do |format|
    if @task.save
       format.html { redirect_to @task, notice: 'Task was successfully created.' }
       format.json { render json: @task, status: :created, location: @task }
       format.js {render :partial => 'tasks', :locals => {:tasks => current_user.department.tasks}}
    else
     format.html { render action: "new" }
     format.json { render json: @task.errors, status: :unprocessable_entity }
    end
end

Он выполняет format.js, и консоль говорит «Rendered tasks / _tasks.html.erb (5.8ms)», но обратный вызов для вызова ajax не работает.

$('form[data-remote]').on 'ajax:success',  (xhr, data, status) ->
  alert(data)

Мне нужно получить событие ajax: success, чтобы скрыть всплывающее окно. Любая помощь?

Answer 1

Решил.

Изменил мой response_to do | format |для этого:

if request.xhr?
  task_list = render_to_string :partial => 'tasks', :locals => {:tasks => current_user.department.tasks}
  task_list =  task_list.html_safe.gsub(/\n/, '').gsub(/\t/, '').gsub(/\r/, '')
  render :json => {:html => task_list, :error => ''}
else
  respond_to do |format|
    if @task.save
          format.html { redirect_to @task, notice: 'Task was successfully created.' }
          format.json { render json: @task, status: :created, location: @task }  
    else
      format.html { render action: "new" }
      format.json { render json: @task.errors, status: :unprocessable_entity }
    end
  end
end

И мой JavaScript для этого:

$('form[data-remote]').on 'ajax:success',  (xhr, data, status) ->
  $modal_container.hide()
  $modal.hide()
  $task_select_div.html(data.html)

Что вы думаете об этом решении?Есть ли недостатки?

Answer 2

Удалить эту строку:

format.js {render :partial => 'tasks', :locals => {:tasks => current_user.department.tasks}}

Обновите ваш обратный вызов js:

$('form[data-remote]').on 'ajax:success',  (xhr, data, status) ->
  alert("hello world")
  $modal_container.hide()
  $modal.hide()
  $task_select_div.html(<%= escape_javascript(render :partial => 'tasks', :locals => {:tasks => current_user.department.tasks} ) %>)