j1981
asked on
Telerik Radeditor turns to blue screen in safari and Chrome
Hi,
I have an issue with RadEditor control while operating it in Safari and Chrome.
Initially the Editor loads fine. See the attachment
"radeditor_BeforeServerBut tonClick.J PG".
But if I click on some server controls, it turns the radeditor in to a blue
screen. See that attachment "radeditor_AfterServerButt onClick.JP G".
The following is the html part of the radeditor.
Request you to please resolve this issue.
I have an issue with RadEditor control while operating it in Safari and Chrome.
Initially the Editor loads fine. See the attachment
"radeditor_BeforeServerBut
But if I click on some server controls, it turns the radeditor in to a blue
screen. See that attachment "radeditor_AfterServerButt
The following is the html part of the radeditor.
Request you to please resolve this issue.
<radE:RadEditor ID="edr_PaymentNoteDtls" Skin="Office2007" ShowHtmlMode="false" ShowPreviewMode="false" CssClass="NormalHeading" SubmitCancelButtons="false" runat="server" Width="940px" Height="450px" ToolsFile="~/RadControls/Editor/ToolsFile.xml" StripFormattingOnPaste="MSWordNoFonts" NewLineBr="False" ImagesPaths="~/DocumentImages" UploadImagesPaths="~/DocumentImages" DeleteImagesPaths="~/DocumentImages"> </radE:RadEditor>
radeditor-AfterServerButtonClick.JPG
You may have to override the css class with one of your own and use the !Important attribute to ensure that your class has precedence. I know I have run into similar issues with the rad grid.
ASKER
Thank you binaryevo... Can you please put little more details ..
Here is an example of one i created that works flawlessly.
<script type="text/javascript">
function OnClientPasteHtml(sender, args) {
var commandName = args.get_commandName();
var value = args.get_value();
if (commandName == "InsertDate" || commandName == "InsertTime") {
//Set the inserted date / time string in a DIV with formatting
var div = document.createElement("DIV");
Telerik.Web.UI.Editor.Utils.setElementInnerHtml(div, value);
//Set date/time information in a DIV element with applied color and background formatting
args.set_value("<div style='margin: 1px; padding:2px; width:auto; display:inline;border:solid 2px black; color:black; background-color:#FFCC00;'>" + div.innerHTML + "</div>");
}
if (commandName == "ImageManager") {
//See if an img has an alt tag set
var div = document.createElement("DIV");
//Do not use div.innerHTML as in IE this would cause the image's src or the link's href to be converted to absolute path.
//This is a severe IE quirk.
Telerik.Web.UI.Editor.Utils.setElementInnerHtml(div, value);
//Now check if there is alt attribute
var img = div.firstChild;
if (!img.alt) {
var alt = prompt("No alt tag specified. Please specify an alt attribute for the image", "");
img.setAttribute("alt", alt);
//Set new content to be pasted into the editor
args.set_value(div.innerHTML);
}
}
if (commandName == "DocumentManager") {
//Set target="_blank" to the links inserted through the Document manager
var div = document.createElement("DIV");
Telerik.Web.UI.Editor.Utils.setElementInnerHtml(div, value);
//Now check if there is target attribute
var link = div.firstChild;
if (!link.target) {
alert("No target attribute specified. The editor will automatically set target='blank' to the link");
link.setAttribute("target", "_blank");
//Set new content to be pasted into the editor
args.set_value(div.innerHTML);
}
}
if (commandName == "InsertTable") {
//Set border to the inserted table elements
var div = document.createElement("DIV");
//Remove extra spaces from begining and end of the tag
value = value.trim();
Telerik.Web.UI.Editor.Utils.setElementInnerHtml(div, value);
var table = div.firstChild;
if (!table.style.border) {
table.style.border = "dashed 1px red";
//Set new content to be pasted into the editor
args.set_value(div.innerHTML);
}
}
//Cancel the event if you want to prevent pasteHtml to execute
/*
args.set_cancel(true);
*/
}
</script><h1>Template Edit</h1>
<br />
<table width="80%" align="center">
<tr>
<td>Name</td>
<td>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>Description</td>
<td>
<asp:TextBox ID="txtDescription" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2">
<asp:CheckBoxList ID="clTypes" runat="server" RepeatDirection="Horizontal">
<asp:ListItem Text="CA"></asp:ListItem>
<asp:ListItem Text="Contract"></asp:ListItem>
<asp:ListItem Text="Proposal"></asp:ListItem>
<asp:ListItem Text="Working Copy"></asp:ListItem>
</asp:CheckBoxList>
</td>
</tr>
</table>
<telerik:RadEditor runat="server" ID="rdEditor" Skin="WebBlue" Height="800px" Width="100%" OnClientPasteHtml="OnClientPasteHtml"></telerik:RadEditor>
<table>
<tr>
<td colspan="2" align="right">
<br /><br />
<asp:Button ID="btnSave" runat="server" Text="Save" Width="100px" OnClick="btnSave_Click" />   
<asp:Button ID="btnCancel" runat="server" Text="Cancel" Width="100px" OnClick="btnCancel_Click" />
</td>
</tr>
</table>
ASKER
Thank you so much.. Let me test with this.
The issue was when using rad editor inside an update panel. When I put that outside the update panel the issue was resolved.
The issue was when using rad editor inside an update panel. When I put that outside the update panel the issue was resolved.
Did you try using teleriks version of the update panel instead?
ASKER
I am sorry. I could not use that as I am new to the telerik stuffs
ASKER
I've requested that this question be closed as follows:
Accepted answer: 0 points for j1981's comment http:/Q_27343250.html#36942066
for the following reason:
The issue was with the updated pannel. I could not get the real solution for this
Accepted answer: 0 points for j1981's comment http:/Q_27343250.html#36942066
for the following reason:
The issue was with the updated pannel. I could not get the real solution for this
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Sorry. I am giving you full points.
ASKER
binaryevo may be correct even I could not apply his solution in fully.