Getting the Dojo 1.5 rich text editor dijit.Editor working nicely with Rails 3
I could not find much on the web and it took me a little time to get everything working (especially saving edited content) so I'll share some code, hopefully to save you some time. In apps/views/layouts/application.html.erb I added some boilerplate (with non-editor stuff not shown) to be included with each rendered page:
Enjoy!
Tweet
<head> <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" type="text/css" href= "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojox/editor/plugins/resources/css/Save.css"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js" djConfig="parseOnLoad: true"> </script> <script type="text/javascript"> dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.Editor"); dojo.require("dojox.editor.plugins.Save"); </script> </head>Then in my view I create an inline rich editor using:
<div dojoType="dijit.Editor" id="editor1" extraPlugins="[{name: 'save', url: 'task'}]"> <%= raw(@task_current.content) %> </div>It is very important to use the raw method because Rails 3 automatically makes safe HTML encoded strings for any result returned by <%= ... %>. Also notice the url value of 'task': this sends the content data to the index method of the task_controller. This method checks to see if an incoming request is an XHR POST and if so gets the raw content:
if request.xhr? if session[:task_id] task = Task.find(session[:task_id]) task.content=request.raw_post task.save! end endFor brevity I did not show any error handling.
Enjoy!
Tweet
Comments
Post a Comment