Rich edit in place

Question

What is the best solution for something that support:

rich editor
edit in place
placeholder
save HTML and strip out malicious etc.

I would like to have a nice and usable interface to change data on a profile. It must support bold, italic and multi-line text and being sure that no malicious code can be injected.

I am looking mostly for the Javascript side but if it come with some PHP code for the backend, it would be nice.

TinyMCE is nice a rich editor. CKEditor is even nicer but it is not free. — Chris Cinelli, Nov 16 '10 at 01:00
For what I know they do not have built in edit-in-place, place holder. Correct? — Chris Cinelli, Nov 16 '10 at 01:02

pstanton · Answer 1 · 2010-11-16T01:10:02.213

2

FCK Editor which is now CKEditor

it is free.

edited Nov 16 '10 at 01:10

answered Nov 16 '10 at 00:54

pstanton

35,033
24
126
168

See comment on the questions. – Chris Cinelli Nov 16 '10 at 01:06

score 1 · Answer 2 · answered Nov 16 '10 at 00:51

1

I use TinyMCE (http://tinymce.moxiecode.com/). It should have the majority of the functionality you need.

answered Nov 16 '10 at 00:51

wajiw

12,239
17
54
73

See comment on the questions. – Chris Cinelli Nov 16 '10 at 01:05

score 1 · Answer 3 · answered Nov 16 '10 at 01:14

I've seen a few options:

CKEditor (my personal favorite)
TinyMCE (also very popular)
NicEdit
YUI's Rich Text Editor (part of much larger, and very good, YUI framework)
Google's Closure Editor (part of Google's closure framework, what you get in GMail etc.)
Dijit Editor (if you're using the Dojo framework)
OpenWYSIWYG (true open source)
jwysiwyg (for jQuery)

Also see http://en.wikipedia.org/wiki/Online_rich-text_editor and http://blog.insicdesigns.com/2009/07/rounding-up-the-best-javascript-wysiwyg-and-markup-editor/

Jakobinsky · Answer 4 · 2010-11-16T01:37:30.400

1

I correctly use NicEdit but I would have changed to aloha-editor, an HTML5 WYSIWYG editor, if I had the time.

That said, I would not recommend any of those WYSIWYG editors as the html output is not only poor but also breaks the overall design by introducing a lot of inline styling that you probably did not expect for.

The only reason I use such an editor is that the client strictly asked for one. If you choose to use this method anyway, you would probably have to preprocess the user input. If I have a choice I use Markdown.

[EDIT: Added an example] As you can see in the html output below, what you see in not always what you get...

WYSIWYG Example:

Markdown Example:

edited Nov 16 '10 at 01:37

answered Nov 16 '10 at 01:14

Jakobinsky

1,294
8
11

Aloha Editor tries to avoid such bad source code as above. We try to generate clean and transparent xHTML code. Please test. If you find something that produces “bad” code report at https://github.com/alohaeditor/Aloha-Editor. It will be fixed with high priority. – Haymo Meran Jan 21 '11 at 16:11

score 1 · Answer 5 · answered Dec 07 '10 at 18:31

I might be wrong (and please let me know if i am), but i don't believe TinyMCE nor CKedit do in place editing (that is, they do not use the contenteditable="true" without creating an iframe).

As far as i can tell, only nicedit ( http://nicedit.com/demos.php?demo=4 ) and google closure ( http://closure-library.googlecode.com/svn/trunk/closure/goog/demos/editor/seamlessfield.html ) are able to edit inline.

I hope i'm wrong :) cheers!

score 0 · Answer 6 · answered Nov 16 '10 at 00:52

0

I'll recommend TinyMCE.

EDIT: And @wajiw beat me to it. Good sign though. :)

answered Nov 16 '10 at 00:52

Jorge Guberte

10,464
8
37
56

See comment on the questions. – Chris Cinelli Nov 16 '10 at 01:02

Rich edit in place

6 Answers6