locked
Ajax makes button visible but then throws error on that button's click RRS feed

  • Question

  • User-1013943323 posted

    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.

     

    Tuesday, October 28, 2014 4:54 PM

Answers

  • User-1013943323 posted

    FINALLY found the problem.  I have been banging my head on Ajax for a long time now with all sorts of things like this just not working the way it is supposed to.  Following everyone's examples and suggestions to the letter and things that absolutely should work, just didn't.  Then I realized that the code always worked in my test project where the ajaxed test page was opened as the Start page.  But that same code didn't work in my real project!!!

    The key was I generally use Server.Transfer to move from page to page. I don't know why, but this screws up ajax on the page.  When I changed to using Response.Redirect to move to the ajaxed page, all those little weird things that just didn't work all worked beautifully.  So after months of hating Ajax, I now love it!

    Thanks to all for trying to help.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, November 18, 2014 9:28 AM

All replies

  • User-271186128 posted

    Hi lisandlaur,

    According to your description, if you want to make the button visible or invisible, you could set the visible property on button click event.

    For the 404 error, I suppose the reason is that the page cannot be found. So, please check the URL.

    Here is a sample about Show/Hide Web Controls in RadAjaxPanel, you could reference to it.

    http://demos.telerik.com/aspnet-ajax/ajax/examples/common/showingwebcontrols/defaultcs.aspx

    And, for more information about 404 error, you could refer to the following link.

    http://support.microsoft.com/kb/827667

    Best Regards,
    Dillion

    Wednesday, October 29, 2014 5:25 AM
  • User-1013943323 posted

    Thanks for your response Zhi. 

    I do know how to make the buttons visible/invisible.  Clicking btnChange makes btnCancel visible just fine. The trouble is that btnCancel does not then respond to its own button click. From googling I do believe it's because its in the same update panel but was not visible at page load time.

    I am not trying to go to another page so the problem is not page not found. Really the btnCancel should just make itself invisible and make btnChange enabled again.

     

    Lisa

    Wednesday, October 29, 2014 8:37 AM
  • User-271186128 posted

    Hi Lisa,

    From your description and with reference to the demo, I suppose the issue is related to that you doesn't set AjaxSetting for btnCancel control in the RadAjaxManager.

    More information, I suggest you reference to the RadAjaxManager in the demo.

    This is the demo address: http://demos.telerik.com/aspnet-ajax/ajax/examples/common/showingwebcontrols/defaultcs.aspx

    Besides, you could also reference to the steps for setting up the btnChange control.

    Best Regards,
    Dillion

    Wednesday, October 29, 2014 9:53 PM
  • User-1013943323 posted

    FINALLY found the problem.  I have been banging my head on Ajax for a long time now with all sorts of things like this just not working the way it is supposed to.  Following everyone's examples and suggestions to the letter and things that absolutely should work, just didn't.  Then I realized that the code always worked in my test project where the ajaxed test page was opened as the Start page.  But that same code didn't work in my real project!!!

    The key was I generally use Server.Transfer to move from page to page. I don't know why, but this screws up ajax on the page.  When I changed to using Response.Redirect to move to the ajaxed page, all those little weird things that just didn't work all worked beautifully.  So after months of hating Ajax, I now love it!

    Thanks to all for trying to help.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, November 18, 2014 9:28 AM