像蛙眼等有时候需要给用户提供预览查看，今天我们就来看看利用Rails和Prototype快捷的提供Live Preview功能。
1，在layout里加入prototype.js
如app/views/layouts/standard.rhtml:
<html>
<head>
<%= javascript_include_tag "prototype" %>
</head>
<body>
<%= yield %>
</body>
</html>
2，定义Entry类
如app/models/entry.rb:
class Entry
attr_accessor :title, :body
end
我们的demo中的模型没有继承ActiveRecord::Base类，只是简单的提供两个可访问的字段
3，定义controller
如app/controllers/diary_controller.rb:
class DiaryController < ApplicationController
layout 'standard'
def new
@entry = Entry.new
end
def preview
render :layout => false
end
end
4，定义rhtml模板
app/views/diary/new.rhtml:
<%= start_form_tag({:action => "save"}, :id => "entry-form")%>
Title:<%= text_field :entry, :title %><br/>
Content:<%= text_field :entry, :body %><br/>
<%= submit_tag "Save" %>
<%= end_form_tag %>
<%= observe_form "entry-form",
:frequency => 1,
:update => "live-preview",
:complete => "Element.show('live-preview')",
:url => {:action => "preview"} %>
<div id="live-preview" style="display: none; border: 1px solid"></div>
app/views/diary/preview.rhtml:
<h2>Diary entry preview</h2>
<h3><%= params[:entry][:title]%></h3>
<%= textilize params[:entry][:body] %>
5，打完收工
访问
http://localhost:3000/diary/new即可看到Live Preview效果
分享到：
相关推荐
rails_email_preview, 在 Rails 中，预览和编辑应用程序邮件程序模板 Rails 电子邮件预览 使用这里 Rails 引擎在浏览器中预览电子邮件。 兼容 Rails 4.2 。电子邮件审阅： 所有电子邮件预览的列表： 代表有两个主题...
安装加 到Gemfile： gem 'rails_email_preview' , '~> 2.2.2' 添加一个初始化程序和路由： $ rails g rails_email_preview:install 在app / mailer_previews /中生成预览类和方法存根$ rails g rails_email_preview:...
Ruby三神书之一（其余的两本是Agile.Web.Development.with.Rails和Ruby For Rails，在我的资源列表也有） Rails is large, powerful, and new. How do you use it effectively? How do you harness the power? And, ...
《Rails 101 入门电子书》是一本非常适合初学者直接入门的书籍，它由xdite编写并出版于2014年6月10日。本书主要针对的是希望学习Ruby on Rails框架的读者，特别是那些想要从零开始掌握这项技术的新手。 #### 二、...
《Rails101_by_rails4.0》是一本专注于Rails 4.0.0版本和Ruby 2.0.0版本的自学教程书籍，它定位于中文读者，旨在成为学习Rails框架的参考教材。Rails（Ruby on Rails）是一个采用Ruby语言编写的开源Web应用框架，它...
《Rails之道》详细讨论了Rails的程序代码并通过分析Rails中的代码片段来深入解释它的功能，同时，《Rails之道》部分章节也摘录了一些API文档中的内容，使读者能够快速地找到对应的API文档、相关的示例代码以及深入的...
Ruby on Rails，通常简称为Rails，是一个基于Ruby编程语言的开源Web应用框架，遵循MVC（Model-View-Controller）架构模式。这个“Rails项目源代码”是一个使用Rails构建的图片分享网站的完整源代码，它揭示了如何...
Rails 3.1 和 Cucumber-Rails 1.2.0 是两个在Web开发领域非常重要的工具，尤其对于Ruby on Rails框架的测试和自动化流程。本文将深入探讨这两个组件，以及它们如何协同工作来增强软件开发的效率和质量。 首先，...
MVC是Rails的核心架构之一，这一章节将详细介绍这三个组件的作用和相互关系。模型负责与数据库交互，管理数据；视图用于展示数据给用户；控制器则处理用户请求，协调模型和视图之间的操作。了解并正确运用MVC模式是...
Rails之道.pdf 高清 带书签
标题 "Rails" 指的是 Ruby on Rails，一个开源的Web应用程序框架，它基于Ruby编程语言，遵循MVC（模型-视图-控制器）架构模式。Rails由David Heinemeier Hansson在2004年创建，其设计理念是强调代码的简洁性、DRY...
在本项目"Ruby-Rails实战之B2C商城开发"中，我们将深入探索使用Ruby on Rails这一强大的Web开发框架来构建一个完整的B2C（Business-to-Consumer）在线商城。Rails是Ruby语言的一个核心框架，以其MVC（Model-View-...
Aptana是一款强大的集成开发环境（IDE），尤其适用于Rails项目的开发，它提供了丰富的特性来提升开发效率。本教程将详细介绍如何使用Aptana与Rails结合，创建一个功能完备的Web应用程序。 首先，我们需要安装Aptana...
Rails指南中文版是针对Ruby on Rails框架的一份详尽教程，旨在帮助开发者深入理解并熟练掌握这个强大的Web应用开发工具。Ruby on Rails（简称Rails）是一个基于Ruby语言的开源Web应用框架，它遵循MVC（Model-View-...
Rails 作为 Ruby 的主要应用框架之一，两者密切相关。 在压缩包的文件名称列表中，只有一个条目 "rails"，这可能意味着压缩包内包含了 Rails 框架的核心文件，如 gemspec 文件、库文件、初始化脚本等。开发者可以...
本压缩包中的"web开发之rails最新调试通过购物车代码"是关于使用Rails进行Web应用开发的一个实例，特别是针对购物车功能的实现。 购物车是电商网站的核心部分，它允许用户选择商品并保存这些选择以便后续购买。在...
标题中的“Web开发敏捷之道--应用Rails进行敏捷Web开发 之 Depot代码”表明这是一个关于使用Ruby on Rails框架进行敏捷Web开发的示例项目，名为Depot。Ruby on Rails（简称Rails）是一个开源的Web应用程序框架，它...
- **步骤**：通过命令行使用`rails new project_name`来初始化一个新的Rails项目。 - **结构**：新项目将包含默认的目录结构，如`app`、`config`、`db`等，分别用于存放应用程序代码、配置文件、数据库迁移脚本等。 ...