SpiceLogic .NET Win HTML Editor Control
 Online Documentation.
Skip Navigation Links.

BodyHtml or DocumentHtml ??

The BodyHTML property

BodyHTML property will give you the part of the HTML document that is bound by <body></body>tag.
So if your edited document has the following html

<html>
<head><title>Hello page</title></head>
<body style="font-family:arial">
<b> Hello World </b>
</body>
</html>

Then BodyHtml property will return following string

<b> Hello World </b>

When you set this property with an HTML string, the HTML will be placed inside the <body> tags. If you set a full HTML document to this BodyHtml property, the control will extract the inner body part from your full html and the BodyHtml property will be set accordingly.

Document HTML property

DocumentHtml property will return the whole html as follows :

<html>
<head><title>Hello page</title></head>
<body style="font-family:arial">
<b> Hello World </b>
</body>
</html> 

You can set this property with any HTML string, either partial HTML or Full Html document.


You can bind both of these properties with Data Sources.
 

There are some cases where you may need to choose a particular property for your need.

 

For example,

  1. If you are using this control to edit a whole web page where you want to keep Style attributes in <Body> tag or JavaScript code within the <head> ..</head> block of the document's html, and then you should use DocumentHtml property. DocumentHtml property returns the whole Html of the document (i.e. <html>....</html>).Otherwise you will not get the same HTML content
  2. And if you change some Body property of the HTML document like "BodyStyle", "BackgroundImagePath", "BodyColor", property set, then you need to choose the document HTML property otherwise you will not get the formatting u performed.
  3. If you load a page with BodyHTML property set then if you may not get the same output if you use body HTML property. Because BodyHTML deducts all the information out of the <body> </body> tag. So it is better you set the DocumentHTML property here.
  4. But if you want to edit html content which will be placed in the part of a web page or somewhere else (for example, <b> hello </b>), then it is convenient to use the property named BodyHtml. BodyHtml property returns only the core html part excluding the <body>..</body> tag.

Loading Html to the Editor:

You can load any html document to the editor by setting the DocumentHtml property as shown here.

Also the user can click the Open button and load any html.


Handling Open Button Clicked event

If you want to customize the Load event you can do that with the new Open Button Clicked Event.

If you want to load html document to this editor, it is recommended that you choose the property "DocumentHtml" unless you are not worried about keeping the header elements of the html document. If you load the html document to BodyHtml then all header elements will be lost and the document may have ambiguous html.


Caution:
If you want to bind your Html content data of string type (from your DataSet) , do not bind both DocumentHtml and BodyHtml property at the same time. Because, as it is explained, BodyHtml and DocumentHtml points to the same document of the editor, where BodyHtml returns a part of the DocumentHtml. So, if you set different values to BodyHtml and DocumentHtml, you will get unexpected results.



Saving Html from the Editor :

This control will give you many options to save HTML document to the editor.

From Code

If you want to save the editor content directly by code, you can simply get the value of DocumentHtml property and save the value as an html to a file. If you want to save the html of the editor by showing a file save dialog to your user then you can use the following snippet.

 

public void SaveHtmlToFile(string SaveFileDialogTitle)

This method is under Operations Composite property. It saves editor content as DocumentHtml.

Also the user can save the editor's html anytime using the save button of the control.

'Save Button Clicked' event

 The default behavior of the editor is that it shows a File Save dialog to the user if the Save button is clicked. But if you wish to override this behaviour then you can handle the 'Save Button Clicked' event. Here is an example:


Firing HtmlChanged Event:

As BodyHtml returns the editor's document html's Body's inner html, so in fact, BodyHtml and DocumentHtml points to the same html document. If BodyHtml is changed, of course DocumentHtml is also changed. So if BodyHtml or DocumentHtml any of them is changed, HtmlChanged event will be fired. This event is similar to a TextBox Control's TextChanged Event.

Output Value as XHTML:

XHTML is a stricter and cleaner version of HTML. By default, the editor returns the old html. i.e. Tags are upper cased, attributes values are not double quoted and tags may be overlapped like <b>abcd<i>efg</b>hjik</i> etc..
But if it is very necessary for you to get XHTML (http://www.w3schools.com/xhtml/xhtml_html.asp) then you have a choice to set a Boolean property named XHTMLMode to True.

public bool XHTMLMode

Once you set this property, you will get lower cased tags, attributes values are double quoted and overlapped tags are fixed and many more xml styled stricken and cleaned html. Setting this property will filter the BodyHtml and DocumentHtml and it is an extra work. So, do not set this to TRUE if you really do not need it.


Getting Value as XML:

.NET Win Html Editor Control comes with a public method for getting Editor content value as XML. Here is the syntax for those methods:

public string GetEditorContentXML()

This method will return string value for the DocumentHtml. Also there is a public method to save the XML data of the editor's content to file.

public void SaveEditorContentAsXml( string fileName)

This method will save the DocumentHtml. The fileName is the location where the xml file will be saved.

Following code snippet will illustrate these two methods