Hi,
I want to use several RadEditor on my web page. I started using the solution 1 of this page:
http://www.telerik.com/support/kb/aspnet-ajax/editor/setting-hidden-radeditor-in-edit-mode-on-click-and-putting-it-in-non-editable-mode-onblur.aspx
It works fine if I set one Radeditor on the page, but if I add another RadEditor on the page, it does not work.
The reproduce the problem, I paste text in the first RadEditor (works fine), but if I paste the same text on the second control (without reloading the page), I meet a "Stack overflow". I'm using IE9.
My telerik version :
Telerik.Web.Design, 2013.1.220.40
Telerik.Web.UI, 2013.1.220.40
Telerik.Web.UI.Skins, 2013.1.220.40
I attach a picture of the result and a sample of my web page (see below).
Can you tell me what I am doing wrong??
Thank you
Steeve
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="_Test2.aspx.cs" Inherits="Web._Test2" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!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"
>
<
title
>Untitled Page</
title
>
<
meta
http-equiv
=
"X-UA-Compatible"
content
=
"IE=8"
/>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"RadScriptManager1"
runat
=
"server"
></
telerik:RadScriptManager
>
<
div
id
=
"lContent"
style
=
"background-color: lightblue;"
>First RadEditor</
div
>
<
div
style
=
"display:none"
id
=
"tContent"
>
<
telerik:RadEditor
runat
=
"server"
ID
=
"RadEditor1"
OnClientLoad
=
"OnClientLoadMandate"
>
<
Content
></
Content
>
</
telerik:RadEditor
>
</
div
>
<
br
/><
br
/><
br
/>
<
div
id
=
"div1"
style
=
"background-color: lightgray;"
>Second RadEditor</
div
>
<
div
style
=
"display:none"
id
=
"div2"
>
<
telerik:RadEditor
runat
=
"server"
ID
=
"RadEditor2"
OnClientLoad
=
"OnClientLoadProjectDesc"
>
<
Content
>RadEditor 2</
Content
>
</
telerik:RadEditor
>
</
div
>
<
telerik:RadCodeBlock
ID
=
"radCodeBlock"
runat
=
"server"
>
<
script
type
=
"text/javascript"
>
var lContent, tContent;
lContent = $get('lContent');
tContent = $get('tContent');
$addHandler(lContent, "click", lContent_Click);
var div1, div2;
div1 = $get('div1');
div2 = $get('div2');
$addHandler(div1, "click", div1_Click);
function OnClientLoadMandate(editor, args) {
var topZone = $get(editor.get_id() + "Top");
topZone.setAttribute("unselectable", "on");
topZone.setAttribute("MozUserSelect", "none");
var buttons = topZone.getElementsByTagName("*");
for (var i = 0; i <
buttons.length
; i++) {
var
a
=
buttons
[i];
a.setAttribute("unselectable", "on");
a.style.MozUserSelect
=
"none"
;
a.style.MozUserFocus
=
"none"
;
a.style.MozUserFocus
=
"ignore"
;
}
var
element
=
document
.all ? editor.get_document().body : editor.get_document();
$telerik.addExternalHandler(element, "blur", function(e)
{
var labelUpdated;
var
editorContent
= editor.get_html(true);
if (lContent.textContent == editorContent)
labelUpdated
=
false
;
else
labelUpdated
=
true
;
lContent.innerHTML
=
editorContent
;
tContent.style.display
=
'none'
;
lContent.style.display
=
''
;
if (labelUpdated)
{
//alert('Updating... ' + editorContent);
}
});
}
function lContent_Click()
{
lContent.style.display
=
'none'
;
tContent.style.display
=
''
;
var editor = $find("<%=RadEditor1.ClientID%>"); //get a reference to RadEditor client object
editor.setFocus(); //set the focus on the the editor
editor.set_html(lContent.innerHTML);
}
function OnClientLoadProjectDesc(editor, args) {
var topZone = $get(editor.get_id() + "Top");
topZone.setAttribute("unselectable", "on");
topZone.setAttribute("MozUserSelect", "none");
var buttons = topZone.getElementsByTagName("*");
for (var i = 0; i <
buttons.length
; i++) {
var
a
=
buttons
[i];
a.setAttribute("unselectable", "on");
a.style.MozUserSelect
=
"none"
;
a.style.MozUserFocus
=
"none"
;
a.style.MozUserFocus
=
"ignore"
;
}
var
element
=
document
.all ? editor.get_document().body : editor.get_document();
$telerik.addExternalHandler(element, "blur", function (e) {
var labelUpdated;
var
editorContent
= editor.get_html(true);
if (div1.textContent == editorContent)
labelUpdated
=
false
;
else
labelUpdated
=
true
;
div1.innerHTML
=
editorContent
;
div2.style.display
=
'none'
;
div1.style.display
=
''
;
if (labelUpdated) {
//alert('Updating... ' + editorContent);
}
});
}
function div1_Click() {
div1.style.display
=
'none'
;
div2.style.display
=
''
;
var editor = $find("<%=RadEditor2.ClientID%>"); //get a reference to RadEditor client object
editor.setFocus(); //set the focus on the the editor
editor.set_html(div1.innerHTML);
}
</
script
>
</
telerik:RadCodeBlock
>
</
form
>
</
body
>
</
html
>