Button no longer retaining 'active' state in 2018.1.221

[Grant]

Hi, 

So (obviously) I've recently updated my KendoUI For jQuery library to the latest version, 2018.1.221. The update has introduced a bug into my code however. In the Release History for Kendo UI R1 2018 SP1 (https://www.telerik.com/support/whats-new/kendo-ui/release-history/kendo-ui-r1-2018-sp1) and it lists the following statement as a bug fix for the Button widget:
"Button keeps active state if pressing Enter to trigger click and changing focus inside click event handler"

A particular feature in my project makes use of setting the state of a kendo button to active to create the equivalent of a "button checkbox". Except now, once i click away from the button I just made active, its active state is removed.

I've created a Dojo example (https://dojo.telerik.com/AKUdABat) which uses the previous kendoUI release to demo what I want to do. Using the 2 version there, click the primary button and note that both buttons are set as active, then click in any white space. In the new release, the primary button's active state is removed, and im confident its due to the button widget fix I previously mentioned.

Please advise on how i can prevent this from happening, or another way of setting the active state of a clicked button without it being reverted.

Thanks in advance,
Grant

[Dimitar]

Hello Grant,

Thank you for the detailed explanation of the issue.

Indeed you are correct that the Button widget has been enhanced to remove the active state when blurred. This however is subject to change and can be easily modified according to the project requirements. This can be achieve by overriding the default implementation as follows:

<script>
  kendo.ui.Button.fn._blur = function(e) {
    e.preventDefault();
  }
</script>

The above is also demonstrated in this modified Dojo example.

Regards,
Dimitar
Progress Telerik

[Grant]

Dimitar, 

You are a life saver, thanks mate. Code freeze is in 2 weeks :)

I understand that the production libraries for KendoUI are all minified, but is there some documentation that details what happens when (for example) 'kendo.ui.Button.fn._blur()' is run? Here we are preventing the entire method from running, but what if there is a line or 2 that I still need to run when a button is blurred, like removing the 'k-state-focused' class for example?

Many Thanks,
Grant

[Dimitar]

Hello Grant,

I am glad that the issue faced is resolved successfully.

In general, the private methods of the Kendo UI library (such as the _blur() method) are not documented. In case you would like to view the exact implementation, you could download the source code from your Telerik Profile and inspect the desired functionality. If the method needs to be extended, this can be achieved as shown with my previous reply.

Regards,
Dimitar
Progress Telerik