What you want to see on DotNetFunda.com ?
Go to DotNetFunda.com
Twitter TwitterLinkedIn
YouTubeGoogle
 Online : 40687 |  Welcome, Guest!   Register  Login
Home > Articles > ASP.NET > Rich Text Editor with ASP.NET

Rich Text Editor with ASP.NET

1 vote(s)
Rating: 5 out of 5
Article posted by Johnbhatt on 9/5/2012 | Views: 2953 | Category: ASP.NET | Level: Beginner | Points: 250 red flag


As we know, ASP.NET lack a Control, that we need most, RichText Editor.
To overcome from this, we can use Many open source editors.
In this Article, we would learn how to Implement Free RichText Editor into ASP.NET website.

Download


 Download source code for Rich Text Editor with ASP.NET


Introduction


As we know, ASP.NET lack a Control, that we need most, RichText Editor. 

If you are trying to create a application or website with Admin Panel or Blog or Forum Website or something such project for Web in ASP.NET platform, we need RickText Editor. 

To overcome from this, we can use Many open source JavaScript based editors, like Tiny MCE, FCKEditor, etc.


Content:


In this Article, we would learn how to Implement Free RichText Editor into ASP.NET website. We are using TinyMCE editor here.

We are using TinyMCE, which is One of most popular and Open Source project. Download latest version of TinyMCE from Download Page, and Extract the Zip File.



Browse the Extracted Location and go to ..\tinymce_3.5.6\tinymce\jscripts folder.

Now Copy the tinymce folder from above Location to your Solution in Visual Studio.



Add a Page where you want to Implement RichTextbox and Design the Page.



Now lets Move to Topic. How to Add TinyMCE in Page and Richtext box Control placed for Content of Blog in above sample.

Insert JavaScript file tiny_mce.js in Web Page and some also initialize this function.

This Code into head Section.
  <script type="text/javascript" src="tiny_mce/tiny_mce.js"></script>
    <script type="text/javascript" language="javascript">
        tinyMCE.init({
            // General options
            mode: "textareas",
            theme: "advanced",
            plugins: "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups",
           
        });
    </script>
Note: You can so many settings, look in Samples and Help Doc of TinyMCE.

Now Run the Page. Look, how it looked.




Without any additional Practice, our TextBox with Multiline turned into RichText Editor.

Now, its ok as per Requirement. No, when you will send Command to Server, it will return Error Like below.



We have to add just One Line of Code in Web.config file and one property in Default.aspx form (Page with Rich Text Editor).

That is : 

in web.config:

<configuration>
  <system.web>
    <compilation debug="true" targetFramework="4.0"/>
    <httpRuntime requestValidationMode="2.0"/>
  </system.web>
</configuration>

and in Page directive:

ValidateRequest = "false"
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" ValidateRequest="false" %>

Now, you can save the Data in Database, Do postback, retrieve same in Rich Text box and do anything you want. 

Conclusion


IT is Jugad. So enything is possible here. Don't be worry about things that are not available. Just modify and make use of things those are available. Tiny MCE is one of the most known and Popular Rich Text editor (WYSIWYG).

Reference

http://www.tinymce.com/download/download.php

If you like this article, subscribe to our RSS Feed. You can also subscribe via email to our Interview Questions, Codes and Forums section.

Page copy protected against web site content infringement by Copyscape
Found interesting? Add this to:



Please Sign In to vote for this post.

Latest Articles from Johnbhatt

About John Bhatt

Experience:4 year(s)
Home page:http://www.johnbhatt.com
Member since:Thursday, June 21, 2012
Level:Starter
Status: [Member]
Biography:John Bhatt is an IT Professional having interest in Web technology. He is Web Designer, Developer, Software Developer, Blogger and Technology Geek. Currently he writes his Blogs at Blog of P.Yar.B and various other Sites. He is Main author and founder of Download Center. Contact Him at : Facebook | Twitter | Website.
 Responses
Posted by: The_Ryan | Posted on: 20 Oct 2012 05:41:05 AM | Points: 25

Rich text editor makes your work easier than ever, coding becomes easy with the help of this editor, thanks for the help.
I want to share something for all, I have come across a useful website for social networking website developers and development: http://www.talentsfromindia.com/social-network-web-developers-programmers.html

>> Write Response - Respond to this post and get points
Related Posts

The asp.net httprequest object provides information about the current http request made by the client browsers. So in this article, we will learn how we can add custom header into httprequest object for each aspx request even if this object is read only.

The article discusses one of the new feature introduced with .NET 4.0 which enable you to Redirect your page for Search Engine

In this article we will get an idea, about how to encode query string while information passing and how to decode it at the receiver end.

In this article lets see how to Insert, Update, Delete in Gridview using Single Stored Procedure

This article deals with validating the FileUpload control which is inside a GridView control.

More ...
About Us | Contact Us | The Team | Advertise | Software Development | Write for us | Testimonials | Privacy Policy | Terms of Use | Link Exchange | Members | Go Top
General Notice: If you find plagiarised (copied) contents on this page, please let us know the original source along with your correct email id (to communicate) for further action.
Copyright © DotNetFunda.Com. All Rights Reserved. Copying or mimicking the site design and layout is prohibited. Logos, company names used here if any are only for reference purposes and they may be respective owner's right or trademarks. | 5/23/2013 11:09:05 AM