HI,
I am using Rad Editor in my project that I have created with VS2010. As per my project requirement, I have a html table in radeditor and i want no one can change the content of this table in design mode as well as in preview mode.
I have tried to unselect to table on OnClientSelectionChange event of rad editor. But it work only in IE not in other browsers. please help me.
i have use this code.
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="demo.aspx.vb" Inherits="ComplianceTable.demo" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!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 runat="server">
<title></title>
<telerik:RadScriptBlock ID="scriptBlock" runat="server">
<script type="text/javascript">
function OnClientSelectionChange(editor, args) {
editor.getSelection()._window.document.selection.empty();
}
</script>
</telerik:RadScriptBlock>
</head>
<body>
<form id="form1" runat="server">
<div>
<telerik:RadScriptManager ID="ScriptManager1" runat="server" />
<telerik:RadEditor runat="server" ID="RadEditor11" OnClientSelectionChange="OnClientSelectionChange"
AllowScripts="true">
<Content>
<table style="width: 700px; margin-top: 20px; margin-left: 15px; border-top-color: rgb(37, 160, 218);
border-right-color: rgb(37, 160, 218); border-top-width: 1px; border-right-width: 1px;
border-top-style: solid; border-right-style: solid; float: left;" id="Table1"
cellspacing="0" cellpadding="0">
<tbody>
<tr style="background-color: rgb(205, 242, 242);" >
<th>
<div contenteditable="true">
<b>Header0</b></div>
</th>
<th>
<div contenteditable="true">
<b>header1</b></div>
</th>
<th>
<div contenteditable="true">
<b>Header2</b></div>
</th>
</tr>
<tr>
<td >
<div contenteditable="true">
cell0
</div>
</td>
<td >
<a contenteditable="true" onclick="return true;" href="">http:// </a>
</td>
<td >
<div contenteditable="true">
cell1</div>
</td>
</tr>
<tr >
<td >
<div contenteditable="true">
cell0
</div>
</td>
<td >
<a contenteditable="true" href="">http:// </a>
</td>
<td >
<div contenteditable="true">
cell1
</div>
</td>
</tr>
</tbody>
</table>
</Content>
</telerik:RadEditor>
</div>
</form>
</body>
</html>
I am using Rad Editor in my project that I have created with VS2010. As per my project requirement, I have a html table in radeditor and i want no one can change the content of this table in design mode as well as in preview mode.
I have tried to unselect to table on OnClientSelectionChange event of rad editor. But it work only in IE not in other browsers. please help me.
i have use this code.
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="demo.aspx.vb" Inherits="ComplianceTable.demo" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!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 runat="server">
<title></title>
<telerik:RadScriptBlock ID="scriptBlock" runat="server">
<script type="text/javascript">
function OnClientSelectionChange(editor, args) {
editor.getSelection()._window.document.selection.empty();
}
</script>
</telerik:RadScriptBlock>
</head>
<body>
<form id="form1" runat="server">
<div>
<telerik:RadScriptManager ID="ScriptManager1" runat="server" />
<telerik:RadEditor runat="server" ID="RadEditor11" OnClientSelectionChange="OnClientSelectionChange"
AllowScripts="true">
<Content>
<table style="width: 700px; margin-top: 20px; margin-left: 15px; border-top-color: rgb(37, 160, 218);
border-right-color: rgb(37, 160, 218); border-top-width: 1px; border-right-width: 1px;
border-top-style: solid; border-right-style: solid; float: left;" id="Table1"
cellspacing="0" cellpadding="0">
<tbody>
<tr style="background-color: rgb(205, 242, 242);" >
<th>
<div contenteditable="true">
<b>Header0</b></div>
</th>
<th>
<div contenteditable="true">
<b>header1</b></div>
</th>
<th>
<div contenteditable="true">
<b>Header2</b></div>
</th>
</tr>
<tr>
<td >
<div contenteditable="true">
cell0
</div>
</td>
<td >
<a contenteditable="true" onclick="return true;" href="">http:// </a>
</td>
<td >
<div contenteditable="true">
cell1</div>
</td>
</tr>
<tr >
<td >
<div contenteditable="true">
cell0
</div>
</td>
<td >
<a contenteditable="true" href="">http:// </a>
</td>
<td >
<div contenteditable="true">
cell1
</div>
</td>
</tr>
</tbody>
</table>
</Content>
</telerik:RadEditor>
</div>
</form>
</body>
</html>
1 Answer, 1 is accepted
0
Hi Gyan,
For this custom client-side script to work you should implement it with cross-browser functionality. The selection object is different in IE, Firefox and Chrome.
You could follow this example script:
the clearSelection() method is the cross browser functionality.
Regards,
Ianko
Telerik
For this custom client-side script to work you should implement it with cross-browser functionality. The selection object is different in IE, Firefox and Chrome.
You could follow this example script:
function OnClientSelectionChange(editor, args) { var editorWindow = editor.getSelection()._window; clearSelection(editorWindow); }function clearSelection(object) { if (object.getSelection) { object.getSelection().removeAllRanges(); } else if (object.document.selection) { object.document.selection.empty(); } }Regards,
Ianko
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.