Hello All,

I'm using a couple of Radbuttons to enable users to download some forms (in Word). This has stopped working in Chromium based browsers for some reason (new Edge, Chrome). It still works in Internet Explorer. No errors in the browser DevTools and no error on the server either.
It also does not work in Cassini (VS2017).

Not sure where to go from here - can anyone confirm/deny?

TIA - Marcus.

code stub:

<telerik:RadButton ButtonType="LinkButton" RenderMode="Lightweight" ID="btnName" runat="server" Text="Button Text" CssClass="TemplBtn" NavigateUrl="~/assets/someform.docx">
         <Icon PrimaryIconCssClass="rbDownload" />
</telerik:RadButton>

A JavaScript error is thrown when a button with AutoPostback enabled on the client-side is clicked in IE.

Note: The error is thown only when the AutoPostback is enabled in the ClientClicked event handle, but not in ClientClicking.

JavaScript error:
SCRIPT5007: Unable to get property 'controlState' of undefined or null reference
File: ScriptResource.axd, Line: 658, Column: 38

When the RadButton is used as a toggle button and some of its toggle state buttons are set with PrimaryIconCssClass property the icons might not be displayed if the following conditions are met at the same time:

-AutoPostBack property of the RadButton is set to false

-One of the togglestate buttons is selected and its PrimaryIconCssClass property is not set.

The issue does not affect the functionality of the button, just the displaying of the icons in the togglestate buttons.

When a RadButton is clicked and the following conditions are met:
    -Page validation is not passed
    -Button's postback is cancelled in OnClientClicking event by setting args.set_cancel(true)
the postback of other RadButtons will not be performed.

RadButton's clicking is triggered when the following conditions are met:

-input type="text" handles onkeypress event

-onkeypress event focuses the RadButton

-the key pressed that is handled by onkeypress event is Space or Enter

Triggering the clicking with "Space" can be workaround by setting some timeout to the focus(). For example:

ASPX:

        <telerik:RadButton ID="RadButton1" runat="server" Text="RadButton"></telerik:RadButton>
        <input type="text" name="name" value=" " onkeypress="KeyPressed();" />

JavaScript:

        function KeyPressed() {
            setTimeout(function () {
                $find("RadButton1").focus();
            }, 200);
        }

If the Target property of the RadButton (ButtonType="LinkButton") is set to a custom string (the name of the target window, where the content of the linked page will be rendered), the link is not opened. For the time being the following workaround can be used:

JavaScript:

    <script>
        function OnClientClicked(sender, args) {
            var target = sender.get_target();
            var navURL = sender.get_navigateUrl();
            window.open(navURL, target)
        }
    </script>

ASPX:

<telerik:RadButton ID="RadButton1" runat="server" ButtonType="LinkButton" Text="click" Target="MyWindow" NavigateUrl="http://www.google.com" OnClientClicked="OnClientClicked" />

For the time being the following CSS workaround can be used:

CSS:

        <style>
            .RadButton.RadButton_Glow.rbSkinnedButton {
                vertical-align: top;
            }
        </style>
Where Glow is the name of the skin that has larger dimensions (e.g., Silk, Glow, etc).
ASPX:

       <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" Skin="Glow"></telerik:RadSkinManager>
        <telerik:RadTextBox runat="server" ID="txtAdminUser" />
        <telerik:RadButton runat="server" ID="btn1" Text="Add" ButtonType="StandardButton" />

The width of the RadButton is higher than the actual one with Silk and Glow skins.

        <telerik:RadButton ID="RadButton1" runat="server" Skin="Silk" Width="300px"></telerik:RadButton>
        <br />
        <telerik:RadButton ID="RadButton2" runat="server" Skin="Glow" Width="300px"></telerik:RadButton>
        <br />
        <telerik:RadButton ID="RadButton3" runat="server" Skin="Default" Width="300px"></telerik:RadButton>
        <br />

Resolution:

    <style>
        span.RadButton {
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }
    </style>

For the time being the following CSS workaround can be used:

CSS:

    <style>
        html .RadButton.RadButton_Glow.RadButton.rbDisabled,
        html .RadButton.RadButton_Glow.RadButton.rbDisabled:hover,
        html .RadButton.RadButton_Glow.RadButton.rbDisabled:active,
        html .RadButton.RadButton_Glow.RadButton.rbDisabled:focus,
        html .RadButton.RadButton_Silk.RadButton.rbDisabled,
        html .RadButton.RadButton_Silk.RadButton.rbDisabled:hover,
        html .RadButton.RadButton_Silk.RadButton.rbDisabled:active,
        html .RadButton.RadButton_Silk.RadButton.rbDisabled:focus,
        html .RadButton.RadButton_Metro.RadButton.rbDisabled,
        html .RadButton.RadButton_Metro.RadButton.rbDisabled:hover,
        html .RadButton.RadButton_Metro.RadButton.rbDisabled:active,
        html .RadButton.RadButton_Metro.RadButton.rbDisabled:focus {
            background-color: transparent;
            background-image: none;
            border: none;
            box-shadow: none;
        }
    </style>

ASPX:

        <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" Skin="Glow"></telerik:RadSkinManager>
        <telerik:RadButton ID="RadButton1" runat="server" ToggleType="Radio" ButtonType="ToggleButton" Checked="true" Enabled="true" />
        <telerik:RadButton ID="RadButton2" runat="server" ToggleType="Radio" ButtonType="ToggleButton" Checked="true" Enabled="false" />
        <telerik:RadButton ID="RadButton3" runat="server" ToggleType="Radio" ButtonType="ToggleButton" Checked="false" Enabled="true" />
        <telerik:RadButton ID="RadButton4" runat="server" ToggleType="Radio" ButtonType="ToggleButton" Checked="false" Enabled="false" />

For the time being the following workaround can be used:

CSS:

    <style>
     .RadButton.RadButton_Metro.rbSkinnedButton:focus input.rbDecorated {
            background-color: #25A0DA !important;
        }
    </style>

        <telerik:RadSkinManager ID="RadSkinManager1" runat="server" Skin="Metro"></telerik:RadSkinManager>
        <telerik:RadTextBox ID="RadTextBox1" runat="server"></telerik:RadTextBox>
        <telerik:RadButton ID="RadButton1" runat="server" Text="click" />

For the time being you can use the following workaround:
JavaScript:
		<script>
			function fixBtnRepaint(sender, args) {
				sender._useModules = false;
			}
		</script>
ASPX:
				<telerik:RadButton ID="RadButton1" runat="server" Text="Click" OnClientLoad="fixBtnRepaint">
				</telerik:RadButton>

For the time being the following workaround can be used:
		<script>
			function OnClientClicked() {
				alert('OnClientClicked');
			}

			function OnClientClicking() {
				alert('OnClientClicking');
			}

			function fixBtnClicked(sender, args) {
				sender._useModules = false;
			}

		</script>
		<telerik:RadButton ID="RadButton1" runat="server" ButtonType="LinkButton" Text="Click" OnClientLoad="fixBtnClicked" Target="_parent" NavigateUrl="http://www.google.com" OnClientClicked="OnClientClicked" OnClientClicking="OnClientClicking" />

The icon of a checkbox button appears over the text when the configured width is not enough to display them both on one line in Classic render mode.

Using RequiredFieldValidator with RadButton (ToogleButton type), RadRadioButtons and RadCheckButtons throws a server exception that cannot be validated. 

Workaround:



ASP.NET:

<telerik:RadRadioButtonList ID="RadRadioButtonList1" runat="server" Text="RadRadioButtonList" >

    <Items>
        <telerik:ButtonListItem Text="Item 1" Value="0" />
        <telerik:ButtonListItem Text="Item 2" Value="1" />
    </Items>
</telerik:RadRadioButtonList>
 
<asp:CustomValidator ID="CustomButtonListValidator" ErrorMessage="errormessage"
    runat="server" OnServerValidate="CustomButtonListValidator_ServerValidate" />


C#:

protected void CustomButtonListValidator_ServerValidate(object source, ServerValidateEventArgs args)

{
    args.IsValid = (RadRadioButtonList1.SelectedIndex > -1);
}

Reproduction:

<telerik:RadButton ID="RadButton1" runat="server" Text="Submit" EnableEmbeddedSkins="false" EnableEmbeddedBaseStylesheet="false"/>
<telerik:RadCheckBox ID="RadCheckBox1" runat="server" Text="CheckBox" Skin="Default" />

Workaround:

<telerik:RadButton ID="RadButton1" runat="server" Text="Submit" Skin=""/>

The appearance of RadRadioButtonList is broken when it is used on the same page with RadButton and the set render mode equals to Auto or Classic.

The bug can be reproduced with the following setup:

No render mode set:        <telerik:RadRadioButtonList ID="RadRadioButtonList3" runat="server">
            <Items>
                <telerik:ButtonListItem Text="AllXxXxX" Value="d" />
                <telerik:ButtonListItem Text="Phone xxxxxxxxx" Value="P" />
                <telerik:ButtonListItem Text="IP/URL xxxxxxxxx" Value="I" />
                <telerik:ButtonListItem Text="General xxxxxxxxx" Value="O" />
            </Items>
        </telerik:RadRadioButtonList>

        <telerik:RadButton runat="server" ID="Button1" Text="Button"/>

RenderMode="Classic":
        <telerik:RadRadioButtonList ID="RadRadioButtonList3" runat="server">
            <Items>
                <telerik:ButtonListItem Text="AllXxXxX" Value="d" />
                <telerik:ButtonListItem Text="Phone xxxxxxxxx" Value="P" />
                <telerik:ButtonListItem Text="IP/URL xxxxxxxxx" Value="I" />
                <telerik:ButtonListItem Text="General xxxxxxxxx" Value="O" />
            </Items>
        </telerik:RadRadioButtonList>

        <telerik:RadButton runat="server" ID="Button1" Text="Button"/>

Currently when the RadButton is focused and the Enter key is pressed, the server-side event OnClick is not triggered. When the Enter key is pressed again, the server-side event is executed.

The issue is reproduced when a dialog is opened in OnClientClicking event.

The workaround is to use

-Either the OnClientClicked event
-OR trigger the server click of the RadButton in the OnClientClicking event:
		<script type="text/javascript">
			function OnClientClicking1(sender, args) {

				alert("Client-click triggered");
				sender.click();
			}
		</script>

If the Width property of a RadButton is set, its appearance in the Visual Studio 2012 Design view will be broken.

The icons sprite starts showing when the width is sufficiently large, test with different values, e.g. 80px, 100px, 200px, 400px, etc.