Попытка сделать форму в диалоге jQuery модальной формой работы. Что мне не хватает? - PullRequest
Новая
       18

Попытка сделать форму в диалоге jQuery модальной формой работы. Что мне не хватает?

0 голосов
/ 21 января 2012

Я хочу, чтобы мои представления / блоги / новые открывались в диалоге.Пытался заставить его работать в соответствии с этим таким ответом: https://stackoverflow.com/a/5318155/732200

Вот мой код (блоги называются "баснями"):

Это мои частичные - представления / басни/fablemaker.html.erb

<div id="fableMaker" title="Fable Maker" style="display:none">

<div id="countdownTimer">
    <span id="countdown_timer" class="timer">4:20</span><br />
    <button id="play_btn">Play Timer</button>
    <button id="pause_btn">Pause Timer</button>
    <button id="reset_btn">Reset Timer</button>

</div>

<%= form_for @fable do |f| %>

  <p>
    <%= f.label :content, "Fable Portal:" %><br />
    <%= f.text_area :content, :style => "" %>
  </p>
  <p>
    <%= f.label :title, "What would you like to title your creation?" %><br />
    <%= f.text_field :title %>
  </p>
      <p><%= f.submit "Create Fable", remote: true %></p>
    <% end %>

    </div>

Вот представления / fables / create.js.erb: 

$("#fableMaker").dialog({
    autoOpen: false,
    height: 900,
    width: 550,
    modal: true,
    title: 'Fable Maker',
    buttons: {
       "Create": function() { $("#fable_form").submit() },
      },
      open: function() {
        $("#fable_form").html("<%= escape_javascript(render('fablemaker')) %>")
    },
});

Вот fables_controller, действие create: 

class FablesController < ApplicationController
  respond_to :html, :js

  def create
    @user  = current_user
    @fable = @user.fables.build(params[:fable])
    @fable.save
    respond_with @fable, :location => @fable
  end

Вот соответствующие маршруты вызовов: 

  root :to => "pages#home"

  resources :fables

  match '/views/fables/fablemaker', :to => 'fables#create'
  get "fables/create"

Это ссылка, которая должна запускать страницу: 

  <li><%= link_to image_tag("makeyourfable.png", :size => "130x102", 
                                                 :alt => "freewriting portal", 
                                                 :class => "typewriter", 
                                                 :mouseover => "makeyourfableH.png"),
                                                 new_fable_path %>
  </li>

Когда я проверяю источник страницы, всеэлементы и поля загружаются, но они не видны - и, разумеется, не в диалоговом окне.Все, что показывает, это мой контент application.html.

1 Ответ

1 голос
/ 23 января 2012

В функции открытия диалогового окна jQuery вы пытаетесь вставить новый HTML в элемент #fable_form.

Я полагаю, вы хотели вставить этот HTML-код в элемент #fableMaker.

Этот ответ js отображает html, который будет составлять форму, и вставлять в div, который вы уже имели в вызывающем представлении. 

$("#fableMaker").dialog({
    autoOpen: false,
    height: 900,
    width: 550,
    modal: true,
    title: 'Fable Maker',
    buttons: {
       "Create": function() { $("#fable_form").submit() },
      },
      open: function() {
        $("#fableMaker").html("<%= escape_javascript(render('fablemaker')) %>")
    },
});
...