SharePoint Rich Text Editor Control Using Javascript

Question

I have to create SharePoint Rich Text Editor Control using JavaScript. How can I create?

At the run time it will be decided how many control I have to display because of that I can not use static control.

Answer 1

You don't give many details in your question but here's a suggestion that might work for you.

You can use CKeditor (http://ckeditor.com/) in a script editor web part to do this.

Here is a fiddle from TheSharpieOne that shows nicely how you can use CKEditor (with Angular):

http://jsfiddle.net/thesharpieone/cptr7/

Answer 2

You can use the built-in SharePoint Rich Text Editor, as per this link. Create a div for each such field you want to add, with contentEditable set to true.

<div contentEditable="true" role="textbox"
     aria-haspopup="true" aria-autocomplete="both"
     aria-multiline="true" />
  <!-- field content goes here -->
</div>

(The role and aria-* attributes are for accessibility, not for RTE functionality.)

You'll also need to add a few classes:

• For SP 2010: ms-rtestate-write ms-rteflags-0 ms-rtestate-field
• For SP 2013: ms-rte-layoutszone-inner-editable ms-rtestate-write

As long as you're on a page which already has the Rich Text Editor ribbon enabled, this is all you need to do. The RTE will pick up the div, and start managing its value. (I've tested this with SP 2013.)

If you want to add the ribbon to a page, you'll have to have some server-side code (C#), using MakeRTEContextualTabsAvailable.

Answer 3

http://shareden.blogspot.ru/2013/06/jquery-plugin-for-sharepoint-2010-that.html

I hope this link will help you

Answer 4

I would recommend using one of the third party RichText controls. Quill seems to be a very good candidate.

You can get more details here... Quill