This is a migrated thread and some comments may be shown as answers.

How to hide a toolbar icon on button click ?

5 Answers 311 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Sambasiva
Top achievements
Rank 1
Sambasiva asked on 19 Aug 2008, 06:06 AM
Hi,

I am displaying my data in radeditor after clicking the buttons placed out side the editor.  When i click first button, the editor will be loaded with text content and upon second button click, an image will be loaded into the editor. It is a client side functionality. The radeditor contains the icons Bold, Italic, Underline and Image Map editor in the toolbar.

My requirement is to hide "Image Map Editor" icon from the toolbar when i click first button because, only text content will be loaded into the editor in this case. Upon second button click event, editor should hide B, I and U icons.

Please provide me steps to acheive this functionality.

5 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 19 Aug 2008, 07:23 AM
Hi Sambasiva,

You can hide a toolbar button on the client using the getToolByName() method of the editor, e.g.

var oTool = editor.getToolByName("Bold"); //get a reference to the custom tool
oTool.get_element().style.display = "none";

Kind regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Sambasiva
Top achievements
Rank 1
answered on 19 Aug 2008, 02:20 PM
Hi Rumen,

Thanks for your quick reply. The code given by you is not hiding the toolbar icon completely. It does hidden only the label on the icon i.e, B. But not whole icon itself. Image is still appearing.
0
Rumen
Telerik team
answered on 20 Aug 2008, 02:29 PM
Hi Sambasiva,

The solution works properly on my side. You can see how it works in the attached video. Am I missing something?

This is the used code:

<telerik:radeditor runat="server" ID="RadEditor1" OnClientLoad="OnClientLoad">
<Tools>
      <telerik:EditorToolGroup >
          <telerik:EditorTool Name="Bold" />
          <telerik:EditorTool Name="Italic" />
          <telerik:EditorTool Name="Underline" />
      </telerik:EditorToolGroup>
  </Tools>            
</telerik:radeditor>
<script type="text/javascript">
   function OnClientLoad(editor, args)
   {
        var oTool = editor.getToolByName("Bold"); //get a reference to the tool
        oTool.get_element().style.border = "1px solid red";
   }
</script>

Best regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
dharyl
Top achievements
Rank 1
answered on 02 Feb 2009, 06:14 AM
Hi,


How do I hide them all? in my case i already removed B, I, U buttons. But there is something left. It looked like a separator or something.

 

<td>

<telerik:RadEditor ID="rEditMailBody" runat="server" EditModes="Design" Height="370px" Width="921px" Skin="Vista">

   <Tools>

      <telerik:EditorToolGroup>

            //The Bold, Italic and Underline button are removed from here.
      </telerik:EditorToolGroup>

   </Tools>

</telerik:RadEditor>

</td>

 

 

0
Rumen
Telerik team
answered on 04 Feb 2009, 04:39 PM
Hi,

To hide the whole toolbar just set the ToolsFile property to point to an empty toolsfile.xml file:

Default.aspx:
<telerik:RadEditor ID="rEditMailBody" runat="server" ToolsFile="~/ToolsFile.xml" ></telerik:RadEditor>

ToolsFile.xml:
<?xml version="1.0" encoding="utf-8" ?>
<root>
</root>


Best regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Editor
Asked by
Sambasiva
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Sambasiva
Top achievements
Rank 1
dharyl
Top achievements
Rank 1
Share this question
or