Completed
Last Updated: 13 Jan 2023 11:56 by ADMIN
Release R1 2023
Danny
Created on: 28 Dec 2022 12:18
Category: Button
Type: Bug Report
0
button will stay disabled even after enabling it using the set_enabled client-side property

Code & steps to replicate the issue.

  1. At the initial load, the TargetButton is enabled.
  2. Click the "Toggle Enabled State and Do PostBack" which will disable the button using the set_enabled property and do a PostBack. 
  3. Click again on the "Toggle Enabled State and Do PostBack" to enable the TargetButton and do another PostBack.
  4. While the TargetButton gets enabled via JavaScript, the server still renders the Button as disabled after the PostBack.
<telerik:RadButton runat="server" ID="RadButton1" Text="Target Button" AutoPostBack="true" EnableViewState="true" />
<br />
<br />
<telerik:RadButton runat="server" ID="RadButton2" Text="Toggle Enabled State and Do PostBack" OnClientClicked="toggleEnabledState" AutoPostBack="true" />

<script>
    function toggleEnabledState(sender, args) {
        var radButton1 = $find("<%=   RadButton1.ClientID %>");

        radButton1.set_enabled(!radButton1.get_enabled());
    }
</script>
1 comment
ADMIN
Attila Antal
Posted on: 28 Dec 2022 12:21

Hello Danny,

Thank you for reporting this issue.

The problem is in the C# source code. The Enabled property isn't being set back to True, despite the correct value in the Client State.

 

Workaround

To work around this issue, you can restore the Enabled property value based on the Client-State

Example:

protected void Page_LoadComplete(object sender, EventArgs e)
{
    // If the Button is disabled
    if (!RadButton1.Enabled)
    {
        // bet the Button's client state
        string buttonClientState = Request.Form[RadButton1.ClientStateFieldID];

        // if there is no client state exit the function
        if (string.IsNullOrEmpty(buttonClientState)) return;

        // create a JS Serializer instance
        AdvancedJavaScriptSerializer JsSerializer = new AdvancedJavaScriptSerializer();

        // serialize the Button's state
        ButtonState btnState = JsSerializer.Deserialize<ButtonState>(buttonClientState);

        // ensure the Button's Enabled property reflects the Client-State value
        RadButton1.Enabled = btnState.enabled;
    }
}

// Create a Model for the Button's Client State
class ButtonState
{
    // the enabled property is more than enough
    public bool enabled { get; set; }

    //If you'd like to serialize more properties, you can do so by declaring them additionally.
    //public string text { get; set; }
    //public string value { get; set; }
    //public bool @checked { get; set; }
    //public string navigateUrl { get; set; }
    //public string commandName { get; set; }
    //public string commandArgument { get; set; }
    //public bool autoPostBack { get; set; }
    //public int selectedToggleStateIndex { get; set; }
    //public string validationGroup { get; set; }
    //public bool readOnly { get; set; }
    //public bool primary { get; set; }
}

 

Regards,
Attila Antal
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.