Data loss on subsequent radOpens

[Mark]

I have a ascx control that contains a popup radWindow which contains a datalist that is populated at the time the ascx is loaded on the page.  A button displays the radWindow with the preloaded values in a template, which contains an editable textbox on each row.  When the window is hidden, the textbox values should persist in the hidden window until the Save button on the main page is pressed saving the entire page, plus the values in the hidden radWindow.

When I load the page, and open the radWindow for the first time, the previously saved values are displayed in their respective textboxes.  If I then press OK to hide the window, then immediately reopen it, the values in the VISIBLE textbox are gone.  The values in the label control and the HIDDEN textbox are retained.

If when I open the window for the first time with the original values present, then change any one of the visible text boxes, then close and immediately reopen, all my values are retained, including the preloaded values plus any edits.  I can now open and close as many times as I want without changing any data values and not lose any values in the visible textboxes.

If I change the hidden textbox to visible, it also loses its values as in the above scenario.  If I change the visible textbox to hidden, it retains its values in all scenarios.  The label in the <itemtemplate> doesn't seem to be affected.  

If I navigate to the page, which prepopulates the datalist in the radWindow, and DO NOT open the window, then press save on the main page, I also lose the values in the Visible Textbox.

So, it appears that when a textbox is visible in the window, it does not persist its values, unless something has changed.  Not sure why it will show the values when the window opens for the first time and not show them on any subsequent open.  I have tweaked several settings on the radWindow control to no avail.  This is happening in multiple browsers (Chrome, IE, Edge), so not isolated to browser type.  I am curious what is triggered when a value is changed to suddenly persist the values in the VISIBLE text boxes, why the textboxes do not seem to have persisted values when they are visible, regardless if the window is opened or not.

I converted this from another third-party window control and it worked perfectly.  Since we are now using Telerik, it necessitated the change. The only changes I made to the sourcecode was the javascript function that opens the radWindow in the 'onclick' event and  the <telerik:windowmanager> tag, down the to the <ContentTemplate> wrapper tags.  Everything contained between the ContentTemplate tags is exactly the same, essentially reproducing the previous window controls behavior, with the exception of this issue.

Thoughts?!?

Button that opens the window: 

<input type="button" class="command_button" value="..." onclick="javascript: window.radopen(null, 'radPreWin');" />

Window:

 <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
        <Windows>
            <telerik:RadWindow ID="radPreWin" runat="server" Title="Pre-XXXX Funding" Height="400px"
                Width="300px" Left="150px" ReloadOnShow="true" Modal="true" DestroyOnClose="false">
                <ContentTemplate>
                <center>
                   <br />
                    <table>
                        <tr>
                            <td valign="top" colspan="2" width="100%">
                                <asp:HiddenField ID="hidPreFundArr" runat="server" />
                                <asp:datalist id="dlstPreFundList" runat="server" RepeatDirection="vertical" EnableViewState="true" Height="200"
                                cellpadding="0" cellspacing="0">
                                <itemtemplate>
                                <asp:label ID="lblPreFundYear" Width="66" Runat="server" CssClass="standard-text-small">
                                <%# DataBinder.Eval(Container, "DataItem.CP_Funding_Year_Text") %>
                                </asp:label>
                                <asp:TextBox ID="txtPreFundYear" Runat="server" Visible="false" CssClass="standard-text" Columns="15" Text='<%# DataBinder.Eval(Container, "DataItem.CP_Funding_Year") %>'>
                                </asp:TextBox>
                                <asp:TextBox ID="txtPreFundingAmount" Runat="server" Visible="true" CssClass='standard-text' ReadOnly='<%#IIf(mbIsReadOnly, "True", "False") %>' TabIndex="20" Columns="15" Text='<%# Format(DataBinder.Eval(Container, "DataItem.CP_Funding_Amount"), "#,###") %>'>
                                </asp:TextBox>
                                <asp:comparevalidator ID="txtPreFundingAmountValidator" ControlToValidate="txtPreFundingAmount" Type="Currency" Operator="DataTypeCheck" Display="Dynamic" EnableClientScript="false" ErrorMessage="The funding amount must be numeric." runat="server" />
                                </itemtemplate>
                                </asp:datalist></td>
                        </tr>
                    <tr>
                    <td valign="middle" align="right" width="110">
                    <asp:label id="lblPreFund" CssClass="standard-bold" Runat="server">Sub Total   </asp:label>
                </td>
                    <td valign="middle" align="left" width="140">
                    <asp:textbox id="txtPreFundingTotal" tabIndex="15" CssClass="standard-text-gray" Runat="server" Columns="15" ReadOnly="true" AutoPostBack="false"></asp:textbox>
                <asp:comparevalidator ID="Comparevalidator1" ControlToValidate="txtPreFundingTotal" Type="Currency" Operator="DataTypeCheck" Display="Dynamic" EnableClientScript="false" ErrorMessage="The Funding Amount must be numeric." runat="server" />
                    </td>
                    </tr>
                        <tr>
                            <td colspan="2" align="center">
                                <br />
                                <asp:Button ID="cmdOK" runat="server" Text="OK" CssClass="command_button" Visible="true" OnClientClick="javascript:WindowClose();" />
                            </td>
                        </tr>
                    </table>
                    </center>                    
                </ContentTemplate>
            </telerik:RadWindow>
        </Windows>
    </telerik:RadWindowManager>

 

Javascript function that hides the window when "OK" is pressed:

           function WindowClose()
            {
                var oWindow = $find("<%= radPreWin.ClientID %>");
                oWindow.hide();
            }

[Mark]

I still think there might be an issue with the above scenario between radWindow, TextBox and DataList, but I found a workaround, thanks to Telerik.  

I took the update of the page controls one step further and swapped the default ASP DataList for the RadListView control.  There was virtually no code changes, other than switching associated references in the codebehind from those compatible with DataList to RadListView and this now works.  There is no data loss in any of the scenarios mentioned above.

It seems the two "Rad" controls play better together.

 

Here is my new RadWindow with the RadListView:

 

 <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
        <Windows>
            <telerik:RadWindow ID="radPreWin" runat="server" Title="Pre-XXXX Funding" Height="400px"
                Width="300px" Left="150px" ReloadOnShow="true" Modal="true" DestroyOnClose="false">
                <ContentTemplate>
                <center>
                   <br />
                    <table>
                        <tr>
                            <td valign="top" colspan="2" width="100%">
                                <asp:HiddenField ID="hidPreFundArr" runat="server" />
                                <telerik:RadListView ID="dlstPreFundList" RenderMode="Lightweight" runat="server">
                                    <ItemTemplate>
                                        <table cellpadding="0" cellspacing="0" >
                                            <tr>
                                                <td>
                                            <asp:label ID="lblPreFundYear" Width="66" Runat="server" CssClass="standard-text-small">
                                            <%# DataBinder.Eval(Container, "DataItem.CP_Funding_Year_Text") %>
                                            </asp:label>
                                            <asp:TextBox ID="txtPreFundYear" Runat="server" Visible="false" CssClass="standard-text" Columns="15" Text='<%# DataBinder.Eval(Container, "DataItem.CP_Funding_Year") %>'>
                                            </asp:TextBox>
                                                </td>
                                                <td>
                                            <asp:TextBox ID="txtPreFundingAmount" Runat="server" Visible="true" CssClass='standard-text' ReadOnly='<%#IIf(mbIsReadOnly, "True", "False") %>' TabIndex="20" Columns="15" Text='<%# Format(DataBinder.Eval(Container, "DataItem.CP_Funding_Amount"), "#,###") %>'>
                                            </asp:TextBox>
                                            <asp:comparevalidator ID="txtPreFundingAmountValidator" ControlToValidate="txtPreFundingAmount" Type="Currency" Operator="DataTypeCheck" Display="Dynamic" EnableClientScript="false" ErrorMessage="The funding amount must be numeric." runat="server" />
                                                </td>
                                            </tr>
                                        </table>
                                    </ItemTemplate>
                                </telerik:RadListView>
                            </td>
                        </tr>
                    <tr>
                    <td valign="middle" align="right" width="110">
                    <asp:label id="lblPreFund" CssClass="standard-bold" Runat="server">Sub Total   </asp:label>
                </td>
                    <td valign="middle" align="left" width="140">
                    <asp:textbox id="txtPreFundingTotal" tabIndex="15" CssClass="standard-text-gray" Runat="server" Columns="15" ReadOnly="true" AutoPostBack="false"></asp:textbox>
                <asp:comparevalidator ID="Comparevalidator1" ControlToValidate="txtPreFundingTotal" Type="Currency" Operator="DataTypeCheck" Display="Dynamic" EnableClientScript="false" ErrorMessage="The Funding Amount must be numeric." runat="server" />
                    </td>
                    </tr>
                        <tr>
                            <td colspan="2" align="center">
                                <br />
                                <asp:Button ID="cmdOK" runat="server" Text="OK" CssClass="command_button" Visible="true" OnClientClick="javascript:WindowClose();" />
                            </td>
                        </tr>
                    </table>
                    </center>                    
                </ContentTemplate>
            </telerik:RadWindow>
        </Windows>
    </telerik:RadWindowManager>

[Marin Bratanov]

Hello Mark,

It is good to hear you have found a solution.

When a RadWindow with ContentTemplate is used in a RadWindowManager, similar issues may occur because the window manager does a .Clear() on its Windows collection in Page_Init and re-creates the windows it manages. While this should usually work fine with standard controls, I would guess that this clearing prevents some of the controls (why only the Visible ones, I do not know) from loading their ViewState or POST data. Since clearing a controls collection changes its lifecycle, we recommend keeping RadWindow instances whose ContentTemplate is used outside of a RadWindowManager (noted at the end): https://docs.telerik.com/devtools/aspnet-ajax/controls/window/getting-started/using-radwindow-as-controls-container.

So, something like the snippet below should work well, with the other modification being that you need to $find().show() this RadWindow: https://docs.telerik.com/devtools/aspnet-ajax/controls/window/getting-started/opening-windows. I recommend you do this even with the current setup that works as expected.

<input type="button" class="command_button" value="..." onclick="javascript: showWnd();" />
<script>
    function showWnd() {
        var oWindow = $find("<%= radPreWin.ClientID %>");
        oWindow.show();
    }
</script>

<telerik:RadWindow ID="radPreWin" runat="server" Title="Pre-XXXX Funding" Height="400px"
    Width="300px" Left="150px" ReloadOnShow="true" Modal="true" DestroyOnClose="false">
    <ContentTemplate>
        <%--... actual content goes here, omitted for brevity --%>
    </ContentTemplate>
</telerik:RadWindow>
<telerik:RadWindowManager ID="RadWindowManager1" runat="server">
    <Windows>
        <%--...other instances if necessary, but not ones with ContentTemplate--%>
    </Windows>
</telerik:RadWindowManager>

As to why the RadListView works as expected - this would be a bit weird, but it probably has a lifecycle that is a bit later than the DataList control so it does not get affected as much by the Controls collection change.

Regards,
Marin Bratanov
Progress Telerik