RadEditor Preview Mode Firefox get_html() issue

[Derek]

I need to get the current editor html content on the client side while the editor is in Preview mode.
The code for this is

var editor = $find("<%=RadEditor1.ClientID%>");
var editorcontent = editor.get_html(false);

This works fine with Internet Explorer, but does not return the current html content under Firefox.

Example
the following checkbox is unchecked.

<input name="Check 1" id="Check1" type="checkbox" submitname="Check 1" value="on"/>

In Internet Explorer, checking the checkbox in preview mode and then running the get_html command will return the form element with its current status.

<input name="Check 1" id="Check1" type="checkbox" CHECKED submitname="Check 1" value="on" />

In Firefox, it always returns the initial state of the content, not the current state. ie.

If the checkbox is checked when entering preview mode, get_html will always return:

<input name="Check 1" value="on" id="Check1" type="checkbox" checked="checked" submitname="Check 1" />

If the checkbox is unchecked when entering preview mode, get_html will always return:

<input name="Check 1" value="on" id="Check1" type="checkbox" submitname="Check 1" />

Testing with IE8 and Firefox 3.6. Telerik Q1 2010.

[Dobromir]

Hi Derek,

This is not directly related to RadControls but to the browser itself. RadEditor's content area in Preview mode is an IFRAME and the control is using the browser's default RichTextEditing engine. Different browsers handle differently the indication of elements current status. If you want to examine a DOM element in the text you can use the standard approach:

alert(oDoc.getElementById("Check1").checked);

For your convenience I have attached a sample HTML page with an editable IFRAME element to observe the standard browser behavior.

Best wishes,
Dobromir
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Derek]

Thanks. That explains the problem. This is the solution I used.

 var editor = $find("<%=RadEditor1.ClientID%>");
 var oDocument = editor.get_document(); //get a reference to the editor's document

 var InputTags = oDocument.getElementsByTagName('INPUT');
 for(var k=0, elm; elm=InputTags[k++];) updateDOM(elm);

 var TextAreaTags = oDocument.getElementsByTagName('TEXTAREA');
 for(var k=0, elm; elm=TextAreaTags[k++];) updateDOM(elm);

 var SelectTags = oDocument.getElementsByTagName('SELECT');
 for(var k=0, elm; elm=SelectTags[k++];) updateDOM(elm);

 var editorcontent = editor.get_html(false);

function updateDOM(inputField) {
    // if the inputField ID string has been passed in, get the inputField object
    if (typeof inputField == "string") {
        inputField = oDocument.getElementById(inputField);
    }

    if (inputField.type == "select-one") {
        for (var i=0; i<inputField.options.length; i++) {
            if (i == inputField.selectedIndex) {
                 inputField.options[inputField.selectedIndex].setAttribute("selected","selected");
            }
            else
            {
                inputField.options[i].removeAttribute("selected");
            }
        }
    } else if (inputField.type == "select-multiple") {
        for (var i=0; i<inputField.options.length; i++) {
            if (inputField.options[i].selected) {
                inputField.options[i].setAttribute("selected","selected");
            } else {
                inputField.options[i].removeAttribute("selected");
            }
        }
    } else if (inputField.type == "text") {
        inputField.setAttribute("value",inputField.value);
    } else if (inputField.type == "textarea") {
        inputField.setAttribute("value",inputField.value);
        inputField.innerHTML = inputField.value;
    } else if (inputField.type == "checkbox") {
        if (inputField.checked) {
            inputField.setAttribute("checked","checked");
        } else {
            inputField.removeAttribute("checked");
        }
    } else if (inputField.type == "radio") {
        var radioNames = oDocument.getElementsByName(inputField.name);
        for(var i=0; i < radioNames.length; i++) {
            if (radioNames[i].checked) {
                radioNames[i].setAttribute("checked","checked");
            } else {
                radioNames[i].removeAttribute("checked");
            }
        }
    }
}

[Dobromir]

Hi Derek,

I am glad that you managed to resolve the problem and thank you for sharing your solution with the community.

Greetings,
Dobromir
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.