Integrate FCKEditor with your Ruby on Rails application
来源:百度文库 编辑:神马文学网 时间:2024/05/02 07:54:43
Integrate FCKEditor with your Ruby on Rails application
By Joshua M Charles ( josh.charles AT gmail DOT com)
Last Modified 11/21/2005 - THIS IS A WORK IN PROGRESS
UPDATE: AJAX is now working with the directions provided below. It‘s complicated, however.
Table of Contents
- Basic Setup
- Advanced Work
- Processing Text
- Limitations
- Working with AJAX and FCKEditor
- Plans for the future.
FCKEditor is an open source Javascript application for embedding a rich text box into an HTML form. I will show you have to integrate this application with your Ruby on Rails application.
The first step is to head over to http://www.fckeditor.net and download the latest version of the editor. Once it is downloaded, unzip the contents into a temp file. Copy the following files and folders into your /public/javascripts folder in your rails application:
/editor/
fckconfig.js
fckeditor.js
fckstyles.xml
fcktemplates.xml
When you have them copied over, your javascripts directory should look like this:
Now you need to edit some of the default configuration settings. Open up ‘fckeditor.js‘ in your favorite text editor and set the default path to “/javascripts/”:
Once that is complete, your are ready to insert the editor into your view.
Open up the view you want the editor on, and add the reference to the base javascript file with this line:
<%= javascript_include_tag "fckeditor" %>
That line should fall before the html tag.
The editor works by replacing a text area that already exists, so we need to go ahead and create one:
The final thing we need to do is write the javascript to replace the text area:
Once that is complete, we can fire up the page and view the new editor:
The entire rhtml file follows:
<%= javascript_include_tag "fckeditor" %>
Treat the editor like any other form field, and everything will just work.
You can edit the FCKEditor settings just like you would normally - most of them are contained in the ‘fckconfig.js‘ file. Some of the things you might want to change are the default toolbars, height and width of the editor, and available styles.
Advanced Work
We can create an application helper to make it easy to use the current setup. In the end, I want to be able to just to this:
<%= fckeditor_text_field %>Start by opening up your application_helper.rb. You need to add the following method to this file:
def fckeditor_text_field(object, method, options = {})text_area(object, method, options ) +
javascript_tag( "var oFCKeditor = new FCKeditor(‘" + object + "_" + method + "‘);oFCKeditor.ReplaceTextarea()" )
end
FCKEditor has since changed the way text areas are replaced in Mozilla based browsers. It now needs to read:
javascript_tag( "var oFCKeditor = new FCKeditor(‘" + object + "[" + method + "]‘);oFCKeditor.ReplaceTextarea()" )
This tells Rails to create a regular
<%= fckeditor_text_field( "ObjectName", "MethodName" ) %>If you run into problems, make sure you are still including the fckeditor.js file at the top of your page. All you should need for this helper to work is a browser supported by FCKEditor, and the javascript file included at the top of the page you want the editor on.
Processing Text
Let us suppose you have the following simple form:
<%= start_form_tag :action => ‘save‘ %><%= fckeditor_text_field("Page", "content") %>
<%= submit_tag "Save" %>
<%= end_form_tag %>
<%= link_to ‘Back‘, :action => ‘index‘ %>
This example might be part of a simple content management system that allows users to edit the content of a page. In order to access this content on the other side, treat it as you would any other form field in Rails:
def save
page = Page.new(params[:Page])
page.save
end
newRole.content holds the html that was submitted. If storing this in a database, you need to follow the usual guidelines: escape the characters that need escaping. Decide whether or not to remove