Support forums - Using jQuery to access getHTML

Support forums » Products » Cute Editor for .NET » Using jQuery to access getHTML

Using jQuery to access getHTML

Last post 12-22-2009, 2:11 PM by lharris. 5 replies.


	Sort Posts: Previous Next

11-17-2009, 1:54 PM 57219

lharris
Joined on 05-18-2006
Guelph, Ontario Canada
Posts 34

Using jQuery to access getHTML

Reply Quote

I'm using jQuery to do an auto save draft of a CuteEditor window and I'm trying to access the HTML in the CuteEditor and I'm getting an error.

Here is my code:

var HTMLBodyEnglish = document.getElementById('<%= txtEditorEnglish.ClientID%>');

//var test = HTMLBodyEnglish.innerHTML();

// retrieving the content of Cute Editor as HTML

var content = HTMLBodyEnglish.getHTML();

alert(content);

My error is:

Microsoft JScript runtime error: Object doesn't support this property or method

Any suggestions?

Thanks

Lee

Lee Harris
Programmer & Database Developer

HLB System Solutions
50 Malcolm Road
Guelph, Ontario N1K 1A9
Phone: 519-822-3450 Ext. 239
Fax: 519-822-8861
http://www.hlbsolutions.com

Disclaimer: The contents of this post are provided "as is". There is not warranty on code found in this post.

Filed under: getHTML, jQuery

11-17-2009, 7:38 PM 57227 in reply to 57219

Kenneth
Joined on 02-13-2008
Posts 3,886

Re: Using jQuery to access getHTML

Reply Quote

Hi Lharris,

I tested your code, it works for me.

Can you try the example below on you site?

<%@ Page Language="C#" AutoEventWireup="True" %>
<%@ Register Namespace="CuteEditor" Assembly="CuteEditor" TagPrefix="CE" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
</head>
<body>
<form id="Form1" runat="server">
<CE:Editor ID="txtEditorEnglish" runat="server">
</CE:Editor>
<input type="button" value="show" onclick="showContent()" />
</form>
</body>
</html>
<script type="text/javascript">
function showContent()
{
var HTMLBodyEnglish = document.getElementById('<%= txtEditorEnglish.ClientID%>');
var content = HTMLBodyEnglish.getHTML();
alert(content);
}
</script>

Keep me posted.

Regards,

Ken

11-20-2009, 7:46 AM 57322 in reply to 57227

lharris
Joined on 05-18-2006
Guelph, Ontario Canada
Posts 34

Re: Using jQuery to access getHTML

Reply Quote

Hello Ken,

I've noticed that you add your JavaScript code to the end of the page after the Cute Editor code. Is this required? Right now I need to have my code in the HEAD of the document.

Thanks,

11-23-2009, 3:50 AM 57343 in reply to 57322

Kenneth
Joined on 02-13-2008
Posts 3,886

Re: Using jQuery to access getHTML

Reply Quote

Hi lharris,

It is not required.

Regards,

ken

11-24-2009, 10:28 AM 57390 in reply to 57343

lharris
Joined on 05-18-2006
Guelph, Ontario Canada
Posts 34

Re: Using jQuery to access getHTML

Reply Quote

Hello Ken,

Would jQuery interfere with the retrieveal of the HTML code? I'm going to post my code below so you can see exactly what i'm doing.

$(document).ready(function() {

// Tabs

$('div[id$="_pnlTabs"]').tabs({ fx: { height: 'toggle', opacity: 'toggle', duration: 'fast'} });

// Accordion

$("#NewsletterHTML").accordion({ header: "h3" });

if ($('div[id$="_pnlTabs"]').length) { // Load only on update or create

var HTMLBodyEnglish = document.getElementById('<%= txtEditorEnglish.ClientID%>').getHTML();

var test = HTMLBodyEnglish.innerHTML;

// retrieving the content of Cute Editor as HTML

//var content = HTMLBodyEnglish.getHTML();

//alert(content);

}

});

</script>

<div>

<h3>

<a href="#">English</a></h3>

<div>

<tr>

Heading (English)

</td>

<asp:TextBox ID="txtHeadingEnglish" runat="server" CssClass="MaxWidth" MaxLength="150"></asp:TextBox>

</td>

</td>

</tr>

<tr>

<CE:Editor ID="txtEditorEnglish" runat="server" Height="500" Width="100%" ShowBottomBar="true"

EnableContextMenu="True" AutoConfigure="Default" BreakElement="P">

</CE:Editor>

</td>

</tr>

</table>

</div>

<div>

<h3>

<a href="#">French</a></h3>

<div>

<tr>

Heading (French)

</td>

<asp:TextBox ID="txtHeadingFrench" runat="server" CssClass="MaxWidth" MaxLength="150"></asp:TextBox>

</td>

</td>

</tr>

<tr>

<CE:Editor ID="txtEditorFrench" runat="server" Height="500" Width="100%" ShowBottomBar="true"

EnableContextMenu="True" AutoConfigure="Default" BreakElement="P">

</CE:Editor>

</td>

<%--<td class="tblError"></td>--%>

</tr>

</table>

</div>

<tr>

<asp:Button ID="btnPublish1" runat="server" Text="Publish" OnClick="Publish" />

<asp:Button ID="btnSave1" runat="server" Text="Save Now" OnClick="SaveNow" />

<asp:Button ID="btnDiscard1" runat="server" Text="Discard" CausesValidation="false" OnClick="Discard"

OnClientClick="BLOCKED SCRIPTreturn confirm('This will discard the draft version of this newsletter');" />

</div>

</td>

</tr>

</table>

</div>

Can you see anything in here that will be causing the issue? I've been trying different approaches and even adding the code at the bottom of the page is not working.

Thanks,

12-22-2009, 2:11 PM 57901 in reply to 57219

lharris
Joined on 05-18-2006
Guelph, Ontario Canada
Posts 34

Re: Using jQuery to access getHTML

Reply Quote

I'm still having this issue as discribed above. I'm having trouble using the "getHTML" method with in jQuery...

If you run this..

$(document).ready(function() {
});
function showContent() {
var HTMLBodyEnglish = document.getElementById('<%= txtEditorEnglish.ClientID%>');
var content = HTMLBodyEnglish.getHTML();
alert(content);
}

it works; however if you try to access it in side of the doc.ready tag you get an error

$(document).ready(function() {
var HTMLBodyEnglish = document.getElementById('<%= txtEditorEnglish.ClientID%>');
var content = HTMLBodyEnglish.getHTML();
alert(content);
});

The error is:

Line: 29
Error: Object doesn't support this property or method

Any help would be great

Thanks,
Lee

Filed under: getHTML, jQuery