Hi Hariharan,
Have you tried to implement your own custom module as shown in the
following demo, e.g.
<telerik:radeditor runat="server" ID="RadEditor1" Height="700px" >
<Modules>
<telerik:EditorModule Name="MyModule" Enabled="true" Visible="true" />
<telerik:EditorModule Name="RadEditorStatistics" Enabled="true" Visible="true" />
</Modules>
</telerik:radeditor>
and after that implement the initializeBase function, e.g.
<script type="text/javascript">
MyModule = function(element)
{
MyModule.initializeBase(this, [element]);
}
MyModule.prototype =
{
initialize : function()
{
MyModule.callBaseMethod(this, 'initialize');
var selfPointer = this;
this.get_editor().add_selectionChange(function (){ selfPointer.doSomething(); });
this.doSomething();
},
//A method that does the actual work - it is usually attached to the "selection changed" editor event
doSomething : function()
{
var span = document.createElement ("SPAN");
span.innerHTML = this.get_editor().get_html();
var imageCount = span.getElementsByTagName("IMG").length;
var tableCount = span.getElementsByTagName("TABLE").length;
var element = this.get_element();
element.innerHTML = "<b>CUSTOM MODULE: Images: " + imageCount + " Tables: " + tableCount + "</b>";
element.style.border = "1px solid red";
element.style.backgroundColor = "yellow";
element.style.color = "red";
}
};
MyModule.registerClass('MyModule', Telerik.Web.UI.Editor.Modules.ModuleBase);
</script>
Another option is to override the methods and functions of the built-in Properties inspector module as shown in this forum thread:
Edit html div attributes in design mode.
Kind regards,
Rumen
the Telerik team
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 their
blog feed now