Client Error on Grid

[Mike]

I have a grid with a Button Column to handle deleting an item in the grid, and every time I click the X, I'm prompted with "are you sure?" [which is good], but if I say "ok" to the delete confirmation, there is a JS error being thrown:

Uncaught TypeError: Cannot read property 'toString' of null

in a ScriptResource. The grid is loaded in a modal RadWindow.

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <script type="text/javascript">
        function CloseAndRebind(args) {
            GetRadWindow().BrowserWindow.refreshGrid(args);
            GetRadWindow().close();
        }
        function CancelEdit() {
            GetRadWindow().close();
        }
    </script>
    <asp:Label ID="lblKeywordName" runat="server"></asp:Label>
    <br />
    <div id="gridContainer">
        <telerik:RadAjaxManager runat="server" ID="radAjaxManager">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="rgLists">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rgLists" LoadingPanelID="ralpLoading" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadAjaxLoadingPanel runat="server" ID="ralpLoading" RenderMode="Lightweight"></telerik:RadAjaxLoadingPanel>
        <telerik:RadGrid ID="rgLists" runat="server" AutoGenerateColumns="False" AllowFilteringByColumn="True" AllowPaging="False" AllowSorting="True" Skin="Metro" Width="100%"
            ShowStatusBar="True" GridLines="None" OnNeedDataSource="rgLists_OnNeedDataSource" OnItemCommand="rgLists_OnItemCommand"
            OnItemDataBound="rgLists_OnItemDataBound" OnInsertCommand="rgLists_OnInsertCommand" OnUpdateCommand="rgLists_OnUpdateCommand"
            OnDeleteCommand="rgLists_OnDeleteCommand" RenderMode="Lightweight">
            <ClientSettings AllowColumnsReorder="False" EnableRowHoverStyle="True" EnablePostBackOnRowClick="True" AllowRowsDragDrop="True">
                <Selecting AllowRowSelect="True" EnableDragToSelectRows="False"></Selecting>
                <Scrolling UseStaticHeaders="True"></Scrolling>
            </ClientSettings>
            <GroupingSettings CaseSensitive="False"></GroupingSettings>
            <MasterTableView Width="100%" GridLines="None" DataKeyNames="keyword_id,code_id" ClientDataKeyNames="keyword_id,code_id" EnableHeaderContextMenu="True" CommandItemDisplay="Top"
                InsertItemPageIndexAction="ShowItemOnCurrentPage">
                <NoRecordsTemplate>There are no value pairs found.</NoRecordsTemplate>
                <CommandItemSettings ShowAddNewRecordButton="True" ShowCancelChangesButton="False" ShowSaveChangesButton="False" ShowRefreshButton="True"
                    AddNewRecordText="Add New Code"></CommandItemSettings>
                <Columns>
                    <telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn">
                        <HeaderStyle Width="35px"></HeaderStyle>
                        <ItemStyle VerticalAlign="Top" HorizontalAlign="Left"></ItemStyle>
                    </telerik:GridEditCommandColumn>
                    <telerik:GridButtonColumn ConfirmText="Remove this code?" ConfirmDialogType="RadWindow" ConfirmTitle="Remove" ButtonType="ImageButton"
                        CommandName="Delete" ConfirmDialogHeight="160px" ConfirmDialogWidth="250px" UniqueName="DeleteColumn">
                        <HeaderStyle Width="35px"></HeaderStyle>
                        <ItemStyle VerticalAlign="Top"></ItemStyle>
                    </telerik:GridButtonColumn>
                    <telerik:GridBoundColumn DataField="keyword_id" HeaderText="KeywordId" UniqueName="KeywordId" Visible="False"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="code_id" HeaderText="CodeId" UniqueName="CodeId" Visible="False"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="description" HeaderText="Text" UniqueName="Text"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="code_value" HeaderText="Value" UniqueName="Value"></telerik:GridBoundColumn>
                    <telerik:GridCheckBoxColumn DataField="inactive" HeaderText="Inactive Flag" UniqueName="Inactive"></telerik:GridCheckBoxColumn>
                </Columns>
                <EditFormSettings EditFormType="Template">
                    <FormTemplate>
                        <table class="form">
                            <tr>
                                <th style="text-align: left;">Key:</th>
                                <td style="text-align: left;">
                                    <telerik:RadTextBox runat="server" ID="radKey" EmptyMessage="Key" RenderMode="Lightweight"></telerik:RadTextBox>
                                </td>
                            </tr>
                            <tr>
                                <th style="text-align: left;">Value:</th>
                                <td style="text-align: left;">
                                    <telerik:RadTextBox runat="server" ID="radValue" EmptyMessage="Value" RenderMode="Lightweight"></telerik:RadTextBox>
                                </td>
                            </tr>
                            <tr>
                                <th style="text-align: left;">Inactive:</th>
                                <td style="text-align: left;">
                                    <telerik:RadCheckBox runat="server" ID="radInactive" AutoPostBack="False" RenderMode="Lightweight" />
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2"> </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    <telerik:RadButton runat="server" ID="btnUpdate" Text='<%# (Container is GridEditFormInsertItem) ? "Insert" : "Update" %>'
                                        CommandName='<%# (Container is GridEditFormInsertItem) ? "PerformInsert" : "Update" %>' RenderMode="Lightweight" />
                                    <telerik:RadButton runat="server" ID="btnCancel" Text="Cancel" CommandName="Cancel" CausesValidation="False" RenderMode="Lightweight" />
                                </td>
                            </tr>
                        </table>
                    </FormTemplate>
                </EditFormSettings>
            </MasterTableView>
        </telerik:RadGrid>
    </div>
    <p></p>
    <div style="float: left; margin-left: 10px">
        <telerik:RadButton ID="btnUpdate" runat="server" OnClick="btnUpdate_Click" Text="Save" SingleClick="True" Width="100px" RenderMode="Lightweight" />
        <telerik:RadButton ID="btnCancel" runat="server" OnClick="btnCancel_OnClick" Text="Cancel" Width="100px" CausesValidation="False" RenderMode="Lightweight" />
    </div>
    <telerik:RadWindowManager runat="server" ID="rwmError"></telerik:RadWindowManager>
</asp:Content>

 

The odd thing is, I use this approach in other web apps and have no issues.  Any ideas?

[Eyup]

Hi Mike,

We are aware of this issue. This is a bug in version R1 2017 - DeleteCommand event does not fire with  ConfirmDialogType="RadWindow". You can try to upgrade to version 2017 R1 SP1 to resolve the issue.

Alternatively, you can remove the ConfirmDialogType property and use the default window confirmation:
http://demos.telerik.com/aspnet-ajax/grid/examples/data-editing/batch-editing/defaultcs.aspx

I hope this will prove helpful.

Regards,
Eyup
Telerik by Progress

[Mike]

Upgrading to 2017.1.228 solved the issue, thanks!