Rich-Text Textarea Editor in Rails Using Widg

Often your users might need to enter rich-text in your program: whether it be for updating their profile or leaving comments on your blog, it's common functionality. Using WidgEditor will help you make this easy. There are plugins for various other editors, but so far I've found this simple method the most stable.

1. Download widgEditor (latest version)
2. Edit the widgEditor.js file as shown below if using AJAX
3. Copy the widgEditor.js file into your public/javascripts folder
4. Copy the widgEditor.css file into your applications public/stylesheets folder.
5. Copy all the images from the widgEditor folder to your public/images folder.
6. Include the javascript and css files in your layout file.
7. Give any text field you want to be an editor field a class of “widgEditor”.
Example:
%= stylesheet_link_tag 'widgEditor' %>
%= javascript_include_tag "widgEditor" %>
%= text_area 'profile', 'about', :cols => "50", :rows=>"4", :class=>"widgEditor" %>

Using AJAX and WidgEditor

You'll need to modify widgEditor.js for AJAX. WidgEditor modifies your form submit function to ensure that a clean HTML copy of your input gets submitted. You need to change this so that it handles our AJAX/Javascript forms. In the widgEditor.prototype.modifyFormSubmit function, change the line that reads:
from: oldOnsubmit = theForm.onsubmit;
to: theForm.oldOnsubmit = theForm.onsubmit;

Then just a few lines below in the new onSubmit function, change the oldOnsubmit() function call to
from: return oldOnsubmit();
to: return theForm.oldOnsubmit()