Question

I have an HTMLEditor in my aspx file with id = “txtText”

I am trying to write a JQuery function which checks if the content of the editor is empty.

I originally had:

function check()
{
    if($('#txtText').val() == '')
    {
         return false;
    }
    return true
}

However when I added an alert box to find out why this doesn’t work. I realized that the .val() property of the HTMLEditor is always undefined (whether the editor has text or has no text).

I tried using $(‘#txtText’).content(), which is how I am accessing the data in the code-behind(C#), but that does not seem to work in JQUERY.

After doing some research I found this site: http://forums.asp.net/t/1549543.aspx/1

I have very smiliar code, such that I also made my own custom editor which inherits from the one in AJAXToolkitEditor.

<cc1:CustomEditor ID="txtEditor" Height="600px" runat="server" />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<asp:Button ID="Button1" OnClientClick="getImageContent()"
    runat="server" Text="Button" OnClick="saveContent" />
<asp:HiddenField ID="HiddenField1" runat="server" />

The posted code does not work for me:

function getImageContent() {
var editor = $find("txtEditor");
var editPanel = editor.get_editPanel();
var designPanel = editPanel.get_modePanels()[0];
var s = designPanel.get_content();

document.getElementById("HiddenField1").value = s;

}

The line var editor = $find(“txtEditor”) is a null value.

Answer 1

You’ll likely need to get the generated ClientID (something like ctl00_txtEditor) using a bit of server script (<%=txtEditor.ClientID%>)

HTMLEditor:

Sort hack-ish but this should determine if there is an content in an HTMLEditor control client-side (server-side is easy to check via txtEditor.Content)

jQuery:

$('#<%=txtEditor.ClientID%>').find('iframe').eq(2).contents().find('body').html()

HTMLEditorExtender:

This works for the HTMLEditorExtender which is recommended over using the HTMLEditor control

Note: We recommend that you use the new HtmlEditorExtender instead of
the HtmlEditor control described on this page. The HtmlEditorExtender
takes advantage of HTML5 and works with IE6 and later.

jQuery:

$('#<%=txtEditor.ClientID%>').val()

or JavaScript

document.getElementById('<%=txtEditor.ClientID%>').value