RJS и Observer для отображения / скрытия DIV - PullRequest
0 голосов
/ 08 февраля 2011

У меня есть шаблон RJS, который я использую для выполнения по существу следующих действий:

Исчезновение отправленной формы Показать всплывающее окно с ответом div Создайте новую форму с использованием частичного

Что я хочучтобы сделать это, удерживайте RJS при вызове этой второй формы, пока пользователь не нажмет кнопку «x» во всплывающем окне.

Код RJS на данный момент выглядит следующим образом:

unless @actor.health <= 0 || @actor.finished
  page.visual_effect(:fade, "act_form", :duration => 0.5)
  if @actor.acts.last.decision.consequence && @actor.acts.last.decision.consequence != ""
    page.insert_html :after, 'act_form_wrapper', :partial => 'consequence'
    page.assign 'popup', true
  end

  page.delay(1) do
    page.replace_html("act_form", :partial => 'act_form')
    if @prompt.decisions.count > 1
      page.assign 'decEmpty', true
    else
      page.assign 'decEmpty', false
    end
    if @actor.play.comment_req
      page << 'document.getElementById("act_comment").value = ""'
    end
    page.visual_effect(:appear, "act_form", :duration => 0.5)
  end

  page.replace_html("scores", :partial => 'scores')

else
  flash[:notice] = 'This game is finished. How did you do?'
  page.redirect_to(@actor)
end

И popup div выглядит следующим образом:

<span class="close_consequence"><%= link_to_function image_tag('close.png', :alt => 'close'), "$('.consequence_popup').remove(); popup=false;"  %></span>

Я имел в виду, что переменная «popup» Javascript будет использоваться каким-то циклом while или наблюдателем, который будет удерживаться, если онправда, а затем запустить, когда это было ложно.не уверен, что это вообще возможно или мне следует делать это совсем по-другому.Материал RJS все еще остается для меня загадкой.

1 Ответ

0 голосов
/ 08 февраля 2011

Я бы сделал эту новую форму скрытой с помощью встроенного CSS, а затем заставил бы всплывающее окно отклонить также показать () новую форму.

<div id="new-form" style="display:none;">
  ...
</div>

<div id="popup">
  <div>A Popup!</div>
  <a href="#" onclick="$(this).hide(); $('new-form').show();">Dismiss me</a>
</div>
...