applying class to radspell button

[Mohan]

I want to style radspell button. When I try to add the class to the RadSpell control, it doent  apply to the button but rather styles the surrounding areas. Is there a way I can style the radspell button.

thanks

[Martin]

Hello Mohan,

Please, send us a small running project accompanied with a description of the result you need to achieved. If you want to style the form controls inside the RadSpell dialog you should create a custom skin for RadFormDecorator, as we use it in order to style the dialog's buttons and input boxes.

Sincerely yours,
Martin Ivanov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Mohan]

Please see the attached image to see what I am trying to achieve. I have Print (normal button) and RadSpell control.

I wanted the RadSpell control to look like the Print Button, but when I apply the class it just styles the surrounding areas and not the button itself.

[Georgi Tunev]

Hi Mohan,

Do you use the style or class properties to style the button? I see that RadFormDecorator is decorating that button as well - in order to avoid it, use the class property to assign the CSS to the button.

If you still experience problems, please open a support ticket and send us a sample page along with your CSS  so we could examine it.


Best wishes,
Georgi Tunev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Mohan]

I have the following RadSpell control in the aspx file.

   <telerik:RadSpell ID="RadSpell1" runat="server" style="display: inline"
                    SupportedLanguages="en-US,English" class="fg-button ui-state-default ui-corner-all"
                    ControlsToCheck="txtDescription" />

You can see that the I am using the Class attribute to style the control. But when the control is rendered, the style is applied to  the surrounding div and not the button as show below.

<div id="RadSpell1" class="fg-button ui-state-default ui-corner-all" style="display: inline;">
<input id="RadSpell1SpellChecked" type="hidden" name="RadSpell1" value=""/>
<div id="RadSpell1dialogOpener" style="display: none;">
</div>
<input id="RadSpell1SpellCheck" type="button" onclick="return false;" value="Spell Check" title="Spell Check" name="RadSpell1SpellCheck"/>
<input id="RadSpell1_ClientState" type="hidden" name="RadSpell1_ClientState" autocomplete="off"/>
</div>

My question is how can I apply the class to the input button that is rendered  by radspell.

Thanks

[Rumen]

Hi Mohan,

RadSpell does not offer a Class property so when the composite spell control is rendered on the page this Class string is applied as a class attribute to the DIV wrapper of the control, e.g.

<div class="fg-button ui-state-default ui-corner-all" id="RadSpell1" style="display: inline;" control="[object Object]">

To achieve your scenario set the spell's ButtonType property to ImageButton, e.g.

<telerik:RadSpell ID="RadSpell1" runat="server" style="display: inline" ButtonType="ImageButton"
                    SupportedLanguages="en-US,English"
                    ControlsToCheck="txtDescription" />

and you will be able to style the rendered link button by registering a  .rscLinkImg class on the page.
The ImageButton value of the ButtonType property renders a link with assigned .rscLinkImg class that can be used to modify the look of the rendered control.

Greetings,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[TechSavvySam]

I'm tacking onto an old ticket in hopes that this will help someone else out.  I found this ticket while trying to figure this out today.

I'm using Release 2011.1.413.35

If you are trying to get the Skin to apply to the RadSpell button all you need to do now is set the RadSpell property ButtonType="PushButton" (the default) and put a RadFormDecorator on the page.

If you look at the example:

http://demos.telerik.com/aspnet-ajax/spell/examples/whatsnew/defaultvb.aspx

that's how they are getting the Spell Check button to have the style appropriate for the assigned Skin.