When getting the value of a FCKEditor control using
FCKEditor1.Vlue
In server side, the page will be posted back, and there will be many problems occur. For example:
Problem Title : HTML codes is converted to a table graphically after posting back.
Problem Description:
I use FCKEditor as my HTML editor.
In source mode, I input the following codes:
<table><tr><td>test</td></tr></table>
After switch to View mode, the content in FCKEidtor is as follow:
<table><tr><td>test</td></tr></table>
Then I write the value of FCKEidtor into a text document by the following codes:
IOHelper.WriteFile(@"e:\aaa.txt", FCKeditor1.Value);
when I opened the aaa.txt, I see the following content:
<table><tr><td>test</td></tr></table>
Moreover, after the page is posted back by clicking the Submit button for getting the value of Fckeditor, what I see in the FCKEDITOR is a table instead of the HTML codes.
I switch to the Source mode; I see the following codes instead of the codes I input originally.
<table><tr><td>test</td></tr></table>
Can anyone tell me why? why the "<" is converted to "<" and the ">" is converted to ">" after the page is posted back? How do I show HTML codes to user instead of a table graphically?
This is maybe a bug of FCKEditor, for there is no good solution available to solve it.
And I found most of the developers get the value of a FCKEditor control at client side and put the retrieved value into a hidden input control, and then get the hidden input control's value in server side. Here is some codes of how to operation FCKEditor at client side:
<script type="text/javascript">
<!--
// FCKeditor_OnComplete is a special function that is called when an editor
// instance is loaded ad available to the API. It must be named exactly in
// this way.
function FCKeditor_OnComplete( editorInstance )
{
// Show the editor name and description in the browser status bar.
document.getElementById('eMessage').innerHTML = 'Instance "' editorInstance.Name '" loaded - ' editorInstance.Description ;
// Show this sample buttons.
document.getElementById('eButtons').style.visibility = '' ;
}
function InsertHTML()
{
// Get the editor instance that we want to interact with.
var oEditor = FCKeditorAPI.GetInstance('FCKeditor1') ;
// Check the active editing mode.
if ( oEditor.EditMode == FCK_EDITMODE_WYSIWYG )
{
// Insert the desired HTML.
oEditor.InsertHtml( '- This is some <a href="/Test1.html">sample<\/a> HTML -' ) ;
}
else
alert( 'You must be on WYSIWYG mode!' ) ;
}
function SetContents()
{
// Get the editor instance that we want to interact with.
var oEditor = FCKeditorAPI.GetInstance('FCKeditor1') ;
// Set the editor contents (replace the actual one).
oEditor.SetData( 'This is the <b>new content<\/b> I want in the editor.' ) ;
}
function GetContents()
{
// Get the editor instance that we want to interact with.
var oEditor = FCKeditorAPI.GetInstance('FCKeditor1') ;
// Get the editor contents in XHTML.
alert( oEditor.GetXHTML( true ) ) ; // "true" means you want it formatted.
}
function ExecuteCommand( commandName )
{
// Get the editor instance that we want to interact with.
var oEditor = FCKeditorAPI.GetInstance('FCKeditor1') ;
// Execute the command.
oEditor.Commands.GetCommand( commandName ).Execute() ;
}
function GetLength()
{
// This functions shows that you can interact directly with the editor area
// DOM. In this way you have the freedom to do anything you want with it.
// Get the editor instance that we want to interact with.
var oEditor = FCKeditorAPI.GetInstance('FCKeditor1') ;
// Get the Editor Area DOM (Document object).
var oDOM = oEditor.EditorDocument ;
var iLength ;
// The are two diffent ways to get the text (without HTML markups).
// It is browser specific.
if ( document.all ) // If Internet Explorer.
{
iLength = oDOM.body.innerText.length ;
}
else // If Gecko.
{
var r = oDOM.createRange() ;
r.selectNodeContents( oDOM.body ) ;
iLength = r.toString().length ;
}
alert( 'Actual text length (without HTML markups): ' iLength ' characters' ) ;
}
function GetInnerHTML()
{
// Get the editor instance that we want to interact with.
var oEditor = FCKeditorAPI.GetInstance('FCKeditor1') ;
alert( oEditor.EditorDocument.body.innerHTML ) ;
}
function CheckIsDirty()
{
// Get the editor instance that we want to interact with.
var oEditor = FCKeditorAPI.GetInstance('FCKeditor1') ;
alert( oEditor.IsDirty() ) ;
}
function ResetIsDirty()
{
// Get the editor instance that we want to interact with.
var oEditor = FCKeditorAPI.GetInstance('FCKeditor1') ;
oEditor.ResetIsDirty() ;
alert( 'The "IsDirty" status has been reset' ) ;
}
-->
</script>
Furthermore, you must set the page's ValidateRequest attribute to false.