Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to Create Rich content/text editor using jQuery?

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 1.01k
    Comment on it

    Hello Readers ,

    In this blog, I am going to guide you that how you can create Rich Text Editor in your Application.I am using Jquery plugin to create Rich Text Editor it contains so many features.

    First, you need to include .js file in your web page which converts your textarea to Rich Text Editor.

    <script type="text/javascript" src="richtextbox.js"></script>

    Now I am defining methods to initialize this rich text editor on a text area.

      <script type="text/javascript">
      bkLib.onDomLoaded(function() {
            new nicEditor({maxHeight : 200}).panelInstance('area');
            new nicEditor({fullPanel : true,maxHeight : 200}).panelInstance('area1');
      });
      </script>

    Put it all together

    <!DOCTYPE html>
    <html>
    <head>
      <script type="text/javascript" src="richtextbox.js"></script>
      <script type="text/javascript">
      bkLib.onDomLoaded(function() {
            new nicEditor({maxHeight : 200}).panelInstance('area');
      });
      </script>
    </head>
    <body>
    <h4>Create textarea into a Rich content/text editor using jQuery</h4>
    <div id="sample">
      <h4>Simple textarea</h4>  
      <textarea name="area" id="area" style="width:70%;height:200px;">
     ---- Some Initial Content was in this textarea---
      </textarea>
      
    </div>
    </body>
    </html>
    

    You can Download file attached Below

    I hope you like this please feel free to comment.

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: