在 ruby​​ on Rails 中提交表单时显示结果数据,无需刷新页面

2023-11-30

我对 ruby​​ on Rails 很陌生。我遇到了一个问题。我有一个主题列表,在此列表下方有一个用于添加主题的表格。我正在尝试添加一个主题而不刷新页面,并将该主题显示在主题列表的正下方。新添加的主题正在插入数据库,但如果不刷新页面,它不会显示在列表底部。 这是我的控制器(subject_controller.rb)

    class SubjectController < ApplicationController
    layout 'standard'
    def list
        @subjects = Subject.find(:all)
    end
   def show
        @subject = Subject.find(params[:id])
   end
   def create
        @subject = Subject.new(params[:subject])
        if @subject.save
            render :partial => 'subject', :object => @subject
        end
   end
end  

这是我的部分文件(_subject.html.erb)

<li id="subject_<%= subject.id %>">
<%= link_to subject.name, :action => 'show', :id => subject.id %>
<%= "(#{subject.books.count})" -%>
</li>

这是我的查看页面(list.html.erb)

<ul id="subject_list">
<% @subjects.each do |c| %>
<li><%= link_to c.name, :action => 'show', :id => c.id %>
<%= "(#{c.books.count})" -%></li>
<% end %>
</ul>
<div id="add_subject">
<%= form_for(:subject, :url => {:action => 'create'},
     :update => "subject_list", :position => :bottom,
     :html => {:id => 'subject_form'}, :remote => true) do %>
Name: <%= text_field "subject", "name" %>
<%= submit_tag 'Add', :id => 'create_button', :onClick => 'javascript:submitForm();' %>
<% end %>
</div>

这是我的js文件

function submitForm(){
jQuery.ajax({
        type: 'POST',
        //url: "/subject/create",
        data:jQuery('#subject_form').serialize(),
        error: function(){  },
        success: function(data){ alert(data) },
        complete: function (){   }
        });
    return false;
 }

我正在使用 ruby​​ 1.9.3 和rails 3.2.6


你应该执行以下操作 -

  1. 在你的list.html.erb中替换

    <%= submit_tag 'Add', :id => 'create_button', :onClick => 'javascript:submitForm();' %>
    

with

<%= submit_tag 'Add', :id => 'create_button' %>

2. 使用以下内容创建一个新视图 create.js.erb -

$("#subject_list").innerHTML += "<%= escape_javascript(render(:partial => 'subject')) %>"

3.更新你的控制器方法 -

    if @subject.save
        #render :partial => 'subject', :object => @subject
        respond_to do |format|
            format.js
        end
    end

4.最后在你的主题部分使用实例变量“@subject”而不是“subject”并丢弃你的js文件。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 ruby​​ on Rails 中提交表单时显示结果数据,无需刷新页面 的相关文章

  • Jquery 两个字段的时间差(以小时为单位)

    我的表单中有两个字段 用户可以在其中选择输入时间 start time end time 我想在更改这些字段时重新计算另一个字段的值 我想做的是获取两次之间的小时数 例如 如果我的开始时间为 5 30 结束时间为 7 50 我想将结果 2
  • 检测 WebGL 支持的正确方法?

    我正在尝试跨多个浏览器检测 WebGL 支持 并且遇到了以下情况 当前版本的 Firefox 似乎使用以下检查来报告积极支持 即使访问者的视频卡被列入黑名单和 或 WebGL 被禁用 if window WebGLRenderingCont
  • JSON 数据中的 jQGrid celledit 显示 URL 未设置警报

    我需要从服务器加载 JSON 并且希望用户能够单击并编辑该值 但是当他们编辑时 它不应该调用服务器 我的意思是我不会立即更新 所以我不想编辑网址 所以我尝试了 ClientArray 但它仍然显示 Url is not set 警报框 但是
  • 如何找到div的第一个直接子元素

    这应该很容易 但我做不到 我有一个 id 为 LeftScrollableDiv 的 div 元素 我试图找到它下面的第一个子元素 LeftScrollableDiv first child div table table div 但结果为
  • Jquery获取选中的复选框

    您好 我想获取页面中选定复选框的列表 实际上我真正需要的是获取复选框旁边的元素的文本 该元素是一个 html 元素 li 代码如下 但它不起作用 这是我当前的 jQuery document ready function target cl
  • Jquery 悬停卡

    我在用着http designwithpc com Plugins Hovercard http designwithpc com Plugins Hovercard 但我不知道如何在悬停卡上声明 var 每个工作描述都有自己的 ID 当悬
  • 在特定页面上执行 javascript 的正确“Rails”方式

    我试图在特定页面上运行 javascript 而我唯一的解决方案似乎是反模式 我有controller js内部生成的assets javascripts 我在用着gem jquery turbolinks 我的代码类似于以下内容 docu
  • 为什么 rand() 总是返回相同的数字?

    我在用 兰特 200 在我的 Rails 应用程序中 当我在控制台中运行它时 它总是返回随机数 但如果我在应用程序行中使用它 index rand 200 索引总是相同的号码 为什么会这样以及如何克服这个问题 简单的伪随机数生成器实际上生成
  • 点击加载谷歌地图

    我想在单击链接后显示 Google 地图 我已经尝试过以下方法 当点击链接时 然后 Insert div与 id 链接后map 使用 jQuery 方法 getScript 加载 Google Maps API 添加谷歌地图到div带身份证
  • Instagram 粉丝计数 - 使用 jQuery / json 和 PHP

    经过几个小时的工作和一些帮助萨希尔 米塔尔我们已经成功使用 jQuery json 和 PHP 检索 Instagram 关注者计数 这是我们设法整理的内容 希望对其他想要获取 Instagram 信息的人有所帮助 我们的 jQuery I
  • Ruby 的字符串并置功能的官方文档在哪里?

    我最近意识到 如果你并置一系列 Ruby 字符串文字 例如 a b c 它相当于这些字符串文字的串联 但是 我在任何地方都找不到这种语言功能的记录 我使用术语 并置 和 串联 进行搜索 但只在几个 StackOverflow 响应中找到了对
  • 从 HTTP 登录到 HTTPS

    我的网站默认使用 HTTP 我确实有一个启用 HTTPS 的证书 但只有其上的某些区域强制建立安全连接 登录是通过 Ajax 处理的 我想开始使用 SSL 即使请求来自 HTTP 我尝试强制请求的地址具有 HTTPS 并且它完美地回复 然而
  • javascript 选择自定义光标 (svg)

    我正在动态地将光标更改为悬停时的本地 svg element on mouseover function this css cursor url svgs pointer svg 9 30 auto 工作正常 但我想选择该 svg 来操纵其
  • JavaScript 继承;调用和原型

    要在Javascript中实现继承 通常需要执行以下两个步骤 假设我有一个基类 Animal var Animal function name this name name 我现在想从中派生一个子类 Dog 所以我想说 var Dog fu
  • 通过 ESI:include 设置 Cookie,如何?

    我正在尝试使用 esi 在我的网站上创建忍者缓存 这个想法是 该网站大部分是静态的 我只需要在用户是否登录时做一些花哨的事情 所以我试图在页面A上放置一个 并在页面B的应用程序中设置触发器 这样我就可以将页面 A 缓存在 varnish 上
  • 使用单击事件调用“trigger”方法时的复选框值

    如何在点击事件中获取正确的当前值以通过触发器调用 Html
  • 覆盖 jQuery 验证 MVC4 中的默认设置

    要覆盖查询验证插件 请在文件 http docs jquery com Plugins Validation validate toptions 推荐的方式是 selector validate invalidHandler functio
  • 下载所有 gems 依赖项

    我想通过下载任何所需的文件并将它们带到另一台计算机来安装指南针没有互联网连接 我已经下载了指南针的源包 当我在未连接的计算机上运行 gem 时 它抱怨缺少依赖项 有什么解决办法吗 这正是我遇到的问题 经过一段时间的搜索后 我找到了一个可以使
  • 将数组从 jquery ajax 传递到代码后面

    我必须将二维数组传递给在asp net网页代码后面编写的页面方法我有一个变量objList作为二维数组 我使用以下代码来实现此目的 但没有成功 并且未调用页面方法 脚本语言 function BindTable objList ajax u
  • 没有输入的 jQuery 日期选择器

    我有一个相当复杂的网络应用程序 我想向其中添加一些日期选择 UI 我遇到的问题是我无法从文档中弄清楚如何真正控制日期选择器的出现方式和时间 不涉及任何表单元素 不 我不会添加秘密表单字段 因此简单的开箱即用方法根本行不通 我希望有人可以提供

随机推荐

  • 使用 EXC_BAD_INSTRUCTION 在空扩展中断中声明符合 @objc 协议

    在将 Swift 协议与数组结合使用时遇到了很多很多麻烦 但在 Playground 中出现问题之前我什至无法重现整个问题 这是一个最小的例子 我有两个协议和一个类Bus它声明符合其中一项协议 另外 一个空的扩展Bus声明与其他协议的一致性
  • 外键死锁时如何删除记录?

    我有两张桌子p and u如下 PostgreSQL 9 3 CREATE TABLE p pid integer NOT NULL uid integer CONSTRAINT p fkey FOREIGN KEY uid REFEREN
  • Windows 应用商店应用程序:证书中的主机名无效或不匹配

    在我的 Windows 8 1 应用程序中 当我调用 Web 服务时 出现以下异常 证书中的主机名无效或不匹配 我使用的代码 HttpBaseProtocolFilter filter new HttpBaseProtocolFilter
  • 任务不等待ContinueWith完成

    我有控制台应用程序和代码如下 我的问题是在ContinueWith任务完成之前 控制台应用程序结束 它不等待ContinueWith完成 请告知 请让我知道我遗漏或不正确的内容 var task1 Task
  • 获取字符码值大于十六进制“FFFF”的 Unicode 字符

    Issue The ChrWcharcode 参数是Long标识一个字符 但不允许值大于 65535 十六进制值 HFFFF see MS Help 例如各种符号和象形文字可以在以下位置找到Unicode 十六进制块 1F300 1F5FF
  • 如何使用 SSL 使我的网站有效?

    我有一个网站 位于具有专用 IP 的专用服务器上 并且安装了 SSL 证书 并且有效 当我访问我的网站并输入 https 而不是 http 时 我的网站仅部分加载 因为 google chrome 说我的网站有一些不安全的数据 我的网站尚未
  • 如何检测与预制件子项的碰撞

    我已经开始学习 Unity 并决定做一些练习 所以 我认为开发 Flappy Bird 作为一个实验会很棒 但我遇到了这个问题 您知道 当您在管道之间飞行时 您可以获得积分 为此 我制作了一个带有两个管道的预制件以及它们之间的一个空游戏对象
  • 使用 Jsoup 来 POST 登录数据

    我正在尝试登录这个网站 http deeproute com 这是我的代码 Connection Response res null Connection homeConnection null Document homePage null
  • 我可以搜索 Netbeans 的本地历史记录吗?

    在 Netbeans 项目中的一个文件的早期版本之一中 我编写了后来删除的代码 现在我想检索它 但是现在当我手动转到以前的版本时我找不到它 因为我在这个文件的本地历史记录中有很多版本 而且我不记得我到底什么时候编写了这段代码 有没有办法对此
  • Facebook 聊天机器人(PHP webhook)发送多个回复

    我的 Facebook 聊天机器人正在运行 但在我向它发送初始消息后 它会发回多条消息 这是我的 webhook 脚本 我很欣赏这是一个非常粗糙的工作示例 challenge REQUEST hub challenge verify tok
  • 这些结果类型存在“...”的重载:ClosedRange、CountableClosedRange

    Swift 2 let gap CGFloat randomInRange StackGapMinWidth maxGap 调用中缺少参数标签 范围 Swift 3 新错误 let gap CGFloat randomInRange ran
  • 拆分变量的第一个字母

    我需要从变量 name 中拆分第一个字母 我怎样才能做到呢 name userData name 我怎样才能得到第一封信 请检查是否正确 if userData gender male if firstletter i picture Im
  • MySQL 中的 BULK INSERT 问题

    我在执行批量插入时遇到以下 SQL 命令错误 BULK INSERT libra faculty FROM d faculty csv WITH FIELDTERMINATOR ROWTERMINATOR n 这是错误消息 ERROR 10
  • 我可以将文件添加到本地 Git 存储库但不将其推送到远程吗

    我有许多大型视频文件 我不想将其推送到远程 但我确实想将它们添加到本地存储库 有点像远程版本 gitignore file 那可能吗 更具体地说 我正在开发一个多媒体项目 一个文件夹包含项目元数据文件 它是一个 Screenflow 项目
  • ggplot 中的反向日期时间(POSIXct 数据)轴

    我正在尝试使用 ggplot 创建 POSIXct 时间图 并且想反转轴 但正在努力使其工作 我一直在使用scale y datetime 因为在我的实际应用程序中 控制该轴上的中断非常重要 这是我的问题的一个例子 首先是正常排序 然后是我
  • 获取 Android 设备的永久唯一 ID

    我有一个应用程序 我想在其中使用唯一 ID 来识别设备 我尝试了多种解决方案 但在手机重置后唯一 ID 发生了变化 如 ANDROID ID 我使用了下面的 StackOverflow 链接 但现在不可用 Android 设备有唯一的 ID
  • Matlab加载库错误

    我打算将OpenCV 1 1版本和Matlab2011一起使用 该程序使用调用来加载库 但是 它返回一个错误 gt In loadlibrary at 347 In Untitled at 4 Error using loadlibrary
  • 在 Java 中将二进制输入流读入单个字节数组

    文档说不应该使用available 确定尺寸的方法InputStream 我怎样才能阅读一篇文章的全部内容InputStream到字节数组中 InputStream in assuming already present byte data
  • ActionBarCompat 菜单项未显示[重复]

    这个问题在这里已经有答案了 这是我的general xml file menu menu
  • 在 ruby​​ on Rails 中提交表单时显示结果数据,无需刷新页面

    我对 ruby on Rails 很陌生 我遇到了一个问题 我有一个主题列表 在此列表下方有一个用于添加主题的表格 我正在尝试添加一个主题而不刷新页面 并将该主题显示在主题列表的正下方 新添加的主题正在插入数据库 但如果不刷新页面 它不会显