Book Image

Kendo UI Cookbook

By : Sagar Ganatra
Book Image

Kendo UI Cookbook

By: Sagar Ganatra

Overview of this book

Table of Contents (18 chapters)
Kendo UI Cookbook
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Creating a WYSIWYG Editor using the kendoEditor function


An Editor can be created either by using a textarea or div element. In this recipe, we will create an Editor using a textarea element and show you the default tools available for formatting the data.

How to do it…

Let's first create a textarea element, specifying the number of rows, columns, and width:

<textarea id="editor" 
          row="20" 
          cols="80" 
          style="width: 700px;">
         
</textarea>

The next step is to use this textarea element and create an Editor by invoking the kendoEditor function:

$("#editor").kendoEditor();

The kendoEditor function is used to initialize textarea as an Editor widget. The Editor will now have a WYSIWYG interface, allowing the user to format the text.

How it works…

When you initialize the textarea element as an Editor by invoking the kendoEditor function, various tools are available in the toolset, as shown in the following screenshot:

The toolset bar is shown at the top of...