首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >尝试使jQuery对话框模式中的表单工作。我遗漏了什么?

尝试使jQuery对话框模式中的表单工作。我遗漏了什么?
EN

Stack Overflow用户
提问于 2012-01-21 21:01:07
回答 1查看 709关注 0票数 0

我希望我的视图/博客/新建在对话框中打开。我试着让它按照这个来工作,所以答案是:https://stackoverflow.com/a/5318155/732200

下面是我的代码(博客被称为“寓言”):

这是我的局部视图/fables/fablemaker.html.erb

代码语言:javascript
复制
<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>

下面是views/fables/create.js.erb:

代码语言:javascript
复制
$("#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:

代码语言:javascript
复制
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

以下是相关的路由调用:

代码语言:javascript
复制
  root :to => "pages#home"

  resources :fables

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

这是应该启动页面的链接:

代码语言:javascript
复制
  <li><%= link_to image_tag("makeyourfable.png", :size => "130x102", 
                                                 :alt => "freewriting portal", 
                                                 :class => "typewriter", 
                                                 :mouseover => "makeyourfableH.png"),
                                                 new_fable_path %>
  </li>

当我检查页面源代码时,所有的元素和字段都在加载,但它们是不可见的-当然,也不会出现在对话框中。所有显示的都是我的application.html内容。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-01-23 06:13:43

在对话框jQuery的open函数中,您正在尝试将新的HTML插入到#fable_form元素中。

我相信您的意思是将HTML插入到#fableMaker元素中。

该js响应呈现构成表单的html,并将其插入到调用视图中已有的div中。

代码语言:javascript
复制
$("#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')) %>")
    },
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/8953135

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档