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

RadButton display same style for standard button and link button

11 Answers 453 Views
Button
This is a migrated thread and some comments may be shown as answers.
michaelitrn
Top achievements
Rank 1
michaelitrn asked on 11 Jan 2011, 11:43 PM
Is there a straight forward way to make the rad-button appear the same for both standard and link buttons? I want the control appearance to remain the same as the standard button even when using link button functionality.

11 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 12 Jan 2011, 07:13 AM
Hello,

You can achieve this by creating custom skin for the RadButton. Please go through the following tutorial for more on creating custom skin.
Creating a Custom Skin for RadButton

Thanks,
Shinu.
0
michaelitrn
Top achievements
Rank 1
answered on 12 Jan 2011, 07:50 AM
Shinu - Thanks for the response. I was hoping there was something more simple that creating a custom skin. If I take the time to create the custom skin, I will post the exact modifications I have to complete within the custom skin to get the Link Button to have the same appearance as the Standard Button.

Best Regards,
Michael
0
Bozhidar
Telerik team
answered on 12 Jan 2011, 08:27 AM
Hello Michael,

Shinu is right, there is no easy way to make both link buttons and standard buttons to appear the same way having the standard button look and feel.  They have different rendering depending on their front-end requirements. I suppose, that if you need that behavior for just a few buttons, you could create a few backgrounds using the Standard button design, and then to apply them as a background tot he link button. If you need however to have more buttons with different width, that will no be suitable for you.

Best wishes,
Bojo
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
WAMatt
Top achievements
Rank 2
answered on 28 Mar 2011, 04:06 PM
Are there any plans to allow LinkButtons to have the same styling as StandardButton in future releases?  I would rather not have to create a custom skin just for this, and it seems a reasonable request to add to your enhancement lists.

Thank you!

Matt
0
Pero
Telerik team
answered on 29 Mar 2011, 06:22 PM
Hi Matt,

For the time we don't have such plans, because all the features supported out-of-the-box by the LinkButton can be accomplished with custom code, using the StandardButton.
For example if you want to open a specific URL with a StandardButton (NavigateUrl), you simply handle the clicking client-side event (OnClientClicking property), open the URL using JavaScript, and then cancel the event and the postback. Here is a sample page showing this:
<%@ 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">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <script type="text/javascript">
        function OnClientClicking(button, args)
        {
            window.location = button.get_navigateUrl();
            args.set_cancel(true);
        }  
    </script>
    <div>
        <telerik:RadButton ID="RadButton1" runat="server" Text="RadButton" NavigateUrl="http://www.telerik.com"
            OnClientClicking="OnClientClicking">
        </telerik:RadButton>
        <br />
        <telerik:RadButton ID="RadButton2" runat="server" Text="RadButton" NavigateUrl="http://www.telerik.com"
            ButtonType="LinkButton">
        </telerik:RadButton>
        <asp:Label ID="Label1" runat="server"></asp:Label>
    </div>
    </form>
</body>
</html>


Kind regards,
Pero
the Telerik team
0
Eitan
Top achievements
Rank 1
answered on 17 Apr 2011, 10:20 AM
Hi Piero,
The solution you gave to use the standard button to open an url do not open it in a new window as the linkbutton do.
Regards
  Eitan
 
0
WAMatt
Top achievements
Rank 2
answered on 18 Apr 2011, 02:04 PM

I ended up putting both of the following functions on the page so I could either navigate in the same window or open a new window...

<script type="text/javascript"
            function openWindow(button, args) { 
                window.open(button.get_navigateUrl()); 
                args.set_cancel(true); 
            
            function navWindow(button, args) { 
                window.navigate(button.get_navigateUrl()); 
                args.set_cancel(true); 
            
</script>

And then just set the OnClientClicking event on the buttons to whichever one you need.

<telerik:RadButton ID="RadButton1" runat="server" Text="RadButton" NavigateUrl="http://www.telerik.com"
            OnClientClicking="openWindow">
</telerik:RadButton>
  
<telerik:RadButton ID="RadButton2" runat="server" Text="RadButton" NavigateUrl="http://www.telerik.com"
            OnClientClicking="navWindow">
</telerik:RadButton>

Matt
0
Jittu
Top achievements
Rank 1
answered on 17 Sep 2012, 05:56 PM
Hi,

Skin does not get applied to the whole radbutton. 1/4th of the button color does not change, it remains as the default color.
Is there anything that I am missing?

Code:
 <telerik:RadButton ID="RadButton4" runat="server" Text="Help" Skin="Black" Width="70px">
    <Icon PrimaryIconUrl="Images/icon_help_16.png" />
</telerik:RadButton>
0
Bozhidar
Telerik team
answered on 18 Sep 2012, 07:54 AM
Hi,

I am quite sure I do not understand your issue, the following code works as expected:

<telerik:RadButton ID="RadButton4" runat="server" Text="Help" Skin="Black" Width="70px">
    </telerik:RadButton>

Could you send us a screenshot of what happens when you use it?

Kind regards,
Bozhidar
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.
0
Jittu
Top achievements
Rank 1
answered on 18 Sep 2012, 02:44 PM
Please find the attachment of my problem. The right part of the button is not black
0
Bozhidar
Telerik team
answered on 19 Sep 2012, 05:51 AM
Hello,

I have checked at our demos: http://demos.telerik.com/aspnet-ajax/button/examples/customicons/defaultcs.aspx where there are several buttons similar to the one you are using with Black skin enabled and the issue is not reproducible.

Could you also check the page and confirm if you could reproduce it?

If not, we will need to open a support ticket and to send us a simple sample project with the issue reproduced for further testing.

Greetings,
Bozhidar
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.
Tags
Button
Asked by
michaelitrn
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
michaelitrn
Top achievements
Rank 1
Bozhidar
Telerik team
WAMatt
Top achievements
Rank 2
Pero
Telerik team
Eitan
Top achievements
Rank 1
Jittu
Top achievements
Rank 1
Share this question
or