How to use MDW Editor ?

Mark down Editor(StackOverflow like Editor)

Hi,It is easy to use the Editor in your application with a few steps as follows.
Though implementation is easy,you have to read the documentation and about methods to use the editor well.

Pre-required:
Jquery js

Required to include js and Style Sheets

Click here to get Markdown js and Style Sheets

you have to add the style sheet in header and script in last lines of your html code as shown in following html Code.
Image need to be added in images folder in you application to get the tool bar .
image will be available in the above link.

Now Include the following html Code in you page
please dont change the class names and even writing jquery code dont depend on div ids.

12345678910111213141516171819202122232425  
    
      Test WMD Page
      
      
    
 
    
  //here the editor menu with buttons will be added
      

//Here Content will be written into the Editor
      
      

//This is simultaneous preview div
      



//Script Should be added like this

Now you can see editor.
To get the toolbar above your editor text area you need to include the image url properly in wmd.css .Save Image to your application and add the link in wmd.css.

Tips:

- While Saving the editor content just think about two things.

If you want to use the Editor again ,like modifying your comment or status in facebook you have to save the text area content and also preview content.
For this you have to encode data while saving to db and need to decode to get back it into editor text area as follows.

123456//To encode before saving
 string hdnValue = HttpUtility.HtmlEncode(hdnFieldContent.Value);
        //decoding the html content to view it in Editor text area
                    string content = WebUtility.HtmlDecode(x);

If you don't want to modify anything written in editor once after publish or save then you have to save preview div html content like "div_id.html();" to datatbase.So that all the html content can be saved to your db and can be published anywhere on your page.
you can check the example program given in the link above for understanding

Some more similar references:

Click here
Click here