I have an asp (vb.net) page with a table on it for layout purposes. There are some buttons in the table. When I click on one button, it makes another row of buttons become visible. I have placed the table within a radajax panel because I would like those button clicks to just update just that table, not the rest of the page. But when I click on one of the newly visible buttons I get a 404 javascript error. I'm thinking that because those buttons were not visible on page load, they did not get properly hooked up with the ajaxpanel? Does anybody know how to make this work.
Here is the HTML:
<telerik:RadAjaxPanel runat = "server"><asp:Table ID="Table1" runat="server" ><asp:TableRow ID = "rowLast"><asp:TableCell Width="200px" HorizontalAlign="Right" Font-Bold = "true" ><asp:Label ID="Label1" runat="server" Text="Last ARS Heat:" CssClass="bhFormTitle" > </asp:Label></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign = "Center"><asp:Label ID="lblLastHeatID" runat="server" Text="" CssClass="bhFormTitle" > </asp:Label></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign = "Left" columnspan = "2"><asp:Label ID="lblLastHeatStatus" runat="server" Text="" CssClass="bhFormTitle" width = "200px"> </asp:Label></asp:TableCell></asp:TableRow><asp:TableRow ID = "rowNext" ><asp:TableCell Width="200px" HorizontalAlign="Right" Font-Bold = "true" ><asp:Label ID="Label2" runat="server" Text="Next Planned ARS Heat:" CssClass="bhFormTitle" > </asp:Label></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign = "Center"><asp:Label ID="lblNextHeatID" runat="server" Text="" CssClass="bhFormTitle" > </asp:Label></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign = "Left" columnspan = "2"><asp:Label ID="lblNextHeatStatus" runat="server" Text="" CssClass="bhFormTitle" width = "200px"> </asp:Label></asp:TableCell></asp:TableRow><asp:TableRow ID = "rowChangeButtons" ><asp:TableCell Width="200px" HorizontalAlign="Right"><telerik:RadButton ID="btnChange" text = "Change" runat="server" width = "120px" UseSubmitBehavior = "false" tooltip = "Enter a new heat as the Next Planned Heat. "> </telerik:RadButton></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign="Center"><telerik:RadButton ID="btnDelete" text = "Delete" runat="server" width = "110px" UseSubmitBehavior = "false" tooltip = "Delete the Next Planned Heat." > </telerik:RadButton></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign="Center"><telerik:RadButton ID="btnRequest" text = "Request Override" runat="server" width = "110px" UseSubmitBehavior = "false" tooltip = "Send Email to Quality requesting override permission to run ARS." > </telerik:RadButton></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign="Center"><telerik:RadButton ID="btnOverride" text = "Override" runat="server" width = "110px" UseSubmitBehavior = "false" tooltip = "Enter Override code provided by Quality to approve this heat."> </telerik:RadButton></asp:TableCell></asp:TableRow><asp:TableRow ID = "rowSetupNew" Visible = "false"><asp:TableCell Width="200px" HorizontalAlign="Right" Font-Bold = "true" ><asp:Label ID="Label3" runat="server" Text="Enter Heat ID" CssClass="bhFormTitle" > </asp:Label></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign = "Center"><telerik:RadTextBox ID="txtNewHeatID" width = "110px" runat="server"> </telerik:RadTextBox></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign = "Center"><telerik:RadButton ID="btnValidate" text = "Set as Next Heat" runat="server" width = "110px" UseSubmitBehavior = "false" tooltip = "Save this Heat Number as the Next Planned Heat." > </telerik:RadButton></asp:TableCell><asp:TableCell Width="125px" HorizontalAlign = "Center"><telerik:RadButton ID="btnCancel" text = "Cancel" runat="server" width = "110px" UseSubmitBehavior = "false" > </telerik:RadButton></asp:TableCell></asp:TableRow><asp:TableRow ID = "rowWarning" Visible = "false"><asp:TableCell HorizontalAlign="Center" columnspan = "4" Font-Bold = "false" ><asp:Label ID="lblWarning" runat="server" Text="If you set a new Next Planned Heat, approval will be removed from the current planned heat." Font-Bold = "false" ForeColor = "Red"> </asp:Label></asp:TableCell></asp:TableRow></asp:Table></telerik:RadAjaxPanel>
In the simplest scenario when they click on btnChange, I want rowSetupNew to appear. When they click on btnCancel within rowSetupNew, then rowSetupNew should become invisible again. Right now clicking btnChange works as expected but clicking btnCancel does not.
I tried this other ways as well including using a RadAjaxMananger and setting the ajax settings but all of them had the same problem. Any button that was not visible at the start throws a javascript error. I also tried setting the rows visible in the html and then making them invisible in the prerender event if not ispostback but that didn't help either.
Thanks for any help.