Completed
Last Updated: 11 Aug 2021 10:04 by ADMIN
Release R2 2021 SP1
Lee Malo
Created on: 02 Jun 2021 14:35
Category: Drawer
Type: Bug Report
1
Drawer items in ItemsTemplate are duplicated after an AJAX request

RadDrawer is not disposed properly during an AJAX request. The reasons for this behavior are that

1. The Drawer's dispose() method is not called

2. The Drawer's container element is not removed

 

The issue can be reproduced with the attached page:

1. Run the page

2. Click the Update button

Result: The new items are appended to the initially rendered ones.

Attached Files:
1 comment
ADMIN
Vessy
Posted on: 02 Jun 2021 14:51

Hi Lee,

Thanks a lot for the reported issue. You can work around it temporary by

  1.  Calling the drawer's dispose() method manually in the AjaxManager's OnRequestStart event handler
  2. and removing manually the Drawer widget's container in the RadDrawer dispose() override.

For example:

        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <ClientEvents OnRequestStart="clearContent"/>
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="Timer1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadDrawer1" LoadingPanelID="LoadingPanel1"></telerik:AjaxUpdatedControl>
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadDrawer ID="RadDrawer1" runat="server">
            ...
        </telerik:RadDrawer>
        <telerik:RadCodeBlock runat="server">
            <script>
                function clearContent() {
                    $find("RadDrawer1").dispose();
                }

                Telerik.Web.UI.RadDrawer.prototype.dispose = function () {
                    var l = this;
                    if (l.kendoWidget) {
                        var container = l.kendoWidget.drawerContainer;
                        l.kendoWidget.destroy();
                        container.remove();
                    }
                    delete l.kendoWidget;
                    delete l._options;
                    Telerik.Web.UI.RadDrawer.callBaseMethod(l, "dispose");
                }
            </script>
        </telerik:RadCodeBlock>

 

Regards,
Vessy
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.