locked
asp button not firing inside of TabContainer (Ajaxcontroltoolkit) RRS feed

  • Question

  • User-1456709951 posted

    Hello,

    I load an user control inside of a TabPanel when Tab changed. That user control has an ASP button which doesn't fire the click event. Does anybody know why? Thanks a lot.

    • ASP with the code of the TabContainer:
    <div id="content">
            
                <ajaxToolkit:ToolkitScriptManager runat="Server" EnablePartialRendering="true" ID="ScriptManager1" />
                <script type="text/javascript">
     
     
                    function ToggleHidden(value) {
                        $find('<%=Tabs.ClientID%>').get_tabs()[2].set_enabled(value);
                    }
                </script>
              
                    <ajaxToolkit:TabContainer runat="server" ID="Tabs" Height="100%" BackColor="#FFF8E5" 
                        ActiveTabIndex="0" Width="100%" ScrollBars="Auto" AutoPostBack="true" OnActiveTabChanged="TabContainer_ActiveTabChanged" >
                        <ajaxToolkit:TabPanel runat="server" ID="Panel1" HeaderText="Escritorio">
                            <ContentTemplate>
                        
                            </ContentTemplate>
                        </ajaxToolkit:TabPanel>
                        <ajaxToolkit:TabPanel runat="server" ID="pnlProveedores" HeaderText="Proveedores">
                            <ContentTemplate>
                                
                            </ContentTemplate>
                        </ajaxToolkit:TabPanel>                    
                        
                    </ajaxToolkit:TabContainer>
    
            
            </div>
    • Code behind for the TabContainer
    protected void TabContainer_ActiveTabChanged(object sender, EventArgs e)
            {
                switch(((AjaxControlToolkit.TabContainer)(sender)).ActiveTab.HeaderText)
                {
                    case "Proveedores":
                        loadTabProveedores();
                        break;
                }
     
                
            }
     
            private void loadTabProveedores()
            {
                //Borrar controles
                pnlProveedores.Controls.Clear();
                //Cargar nuevo control
                UC_Proveedores prov = (UC_Proveedores)LoadControl(@"~/usercontrols/proveedores/UC_Proveedores.ascx");
                //Insertar control dentro de la pestaña
                pnlProveedores.Controls.Add(prov);
            }

    • ASP code for the user control with the asp button (the one that I want to fire)
    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UC_Proveedores.ascx.cs" Inherits="lamasin.usercontrols.proveedores.UC_Proveedores" %>
     
    <div>    
        <asp:Button ID="ButtonCrearNuevoNacional" runat="server" Text="CREAR NUEVO NACIONAL" onclick="ButtonCrearNuevoNacional_Click" />
    </div>
    • code behind for the user control
            protected void ButtonCrearNuevoNacional_Click(object sender, EventArgs e)
            {
                
            }

    Thanks for your help.

    Sunday, October 6, 2013 3:42 PM

All replies

  • User-227760790 posted

    hi  palmanal,

    i suggest you try to use UpdatePanel control.

     Here are some code ,you can try the follow workaround:

              //Borrar controles
                pnlProveedores.Controls.Clear(); 
             
                //Cargar nuevo control
                UpdatePanel updatepanel = new UpdatePanel();         
              UC_Proveedores prov = (UC_Proveedores)LoadControl(@"~/UC_Proveedores.ascx");
              updatepanel.ContentTemplateContainer.Controls.Add(prov);
               pnlProveedores.Controls.Add(updatepanel);


     

    Monday, October 7, 2013 5:55 AM
  • User398825048 posted

    You may need to use 'UpdateMode' and Triggers for asp.net ajax.

    Monday, October 7, 2013 7:30 AM
  • User-1456709951 posted

    Thanks for your answer.

    It didn't work for me.

    Tuesday, October 8, 2013 6:38 AM
  • User-1456709951 posted

    Thanks er_abhi.

    How can I add the a trigger for my button (it's inside of the user control) programmatically?

    I tried this:

                //Borrar controles
                pnlProveedores.Controls.Clear();
                //Cargar nuevo control            
                UpdatePanel updPanel = new UpdatePanel();
                updPanel.UpdateMode = UpdatePanelUpdateMode.Conditional;
     
                UpdatePanelControlTrigger trig = new PostBackTrigger();
                trig.ControlID = "Tabs_pnlProveedores_ctl03_ButtonCrearNuevoNacional";
                updPanel.Triggers.Add(trig);
                
                UC_Proveedores prov = (UC_Proveedores)LoadControl(@"~/usercontrols/proveedores/UC_Proveedores.ascx");
                updPanel.ContentTemplateContainer.Controls.Add(prov);
                pnlProveedores.Controls.Add(updPanel);
                //Insertar control dentro de la pestaña
                pnlProveedores.Controls.Add(prov);

    but I got the next error message: 

    A control with ID 'Tabs_pnlProveedores_ctl03_ButtonCrearNuevoNacional' could not be found for the trigger in UpdatePanel ''.

    Tuesday, October 8, 2013 6:43 AM
  • User398825048 posted

    Looks like the ID which you are using for the button is different from the ID which u have hardcoded here.. If you are using new Asp.net new version then in your usercontrol for this button u can use ' ClientIDMode' property to fix this ID and then try hardcoding the ID here in code.. Also in above code. Try adding Trigger code in the end, i.e. after you have added the user control to update panel.


    Also dont forget to use the Script manager control.

    Tuesday, October 8, 2013 7:48 AM
  • User-1456709951 posted

    er_abhi

    Looks like the ID which you are using for the button is different from the ID which u have hardcoded here.. If you are using new Asp.net new version then in your usercontrol for this button u can use ' ClientIDMode' property to fix this ID and then try hardcoding the ID here in code.. Also in above code. Try adding Trigger code in the end, i.e. after you have added the user control to update panel.


    Also dont forget to use the Script manager control.

    Thanks again. Still same error message:

    A control with ID 'ButtonCrearNuevoNacional' could not be found for the trigger in UpdatePanel ''.

    This is what I did:

    • in the user control:

    <div>    
        <asp:Button ID="ButtonCrearNuevoNacional" ClientIDMode="Static" runat="server" Text="CREAR NUEVO NACIONAL" onclick="ButtonCrearNuevoNacional_Click" />    
    </div>

    • Loading the user control. Code behind from ASP page:

    //Borrar controles
                pnlProveedores.Controls.Clear();
                //Cargar nuevo control            
                UpdatePanel updPanel = new UpdatePanel();
                updPanel.UpdateMode = UpdatePanelUpdateMode.Conditional;            
                
                UC_Proveedores prov = (UC_Proveedores)LoadControl(@"~/usercontrols/proveedores/UC_Proveedores.ascx");
                updPanel.ContentTemplateContainer.Controls.Add(prov);
     
                UpdatePanelControlTrigger trig = new PostBackTrigger();
                trig.ControlID = "ButtonCrearNuevoNacional";
                updPanel.Triggers.Add(trig);
     
                pnlProveedores.Controls.Add(updPanel);


    Tuesday, October 8, 2013 9:51 AM
  • User398825048 posted

    Does your page uses script manager control? If you use master page then u have to use this control there.

    Also try setting the 'ChildasTriggers' property to true of update panel.

    Wednesday, October 9, 2013 12:44 AM
  • User-1456709951 posted

    I don't get that error message anymore. The problem was the Control ID. I used to get an error even when I used 

    ClientIDMode="Static"
    

    so what I did is:

                updPanel.Triggers.Add(new AsyncPostBackTrigger()
                {
                    ControlID = "Tabs$pnlProveedores$ctl02$ButtonCrearNuevoNacional",
                    EventName = "Click"// this may be optional
                });

    Does your page uses script manager control? If you use master page then u have to use this control there.

    Also try setting the 'ChildasTriggers' property to true of update panel.

    I have a normal ASP page not a masterpage. That page uses a script manager control (ajaxToolkit:ToolkitScriptManager): 

    <div id="content">
            
                <ajaxToolkit:ToolkitScriptManager runat="Server" EnablePartialRendering="true" ID="ScriptManager1" EnablePageMethods="true" />
                            
                <script type="text/javascript">
     
                    function ToggleHidden(value) {
                        $find('<%=Tabs.ClientID%>').get_tabs()[2].set_enabled(value);
                    }
                </script>
              
                    <ajaxToolkit:TabContainer runat="server" ID="Tabs" Height="100%" BackColor="#FFF8E5"
                        ActiveTabIndex="0" Width="100%" ScrollBars="Auto" AutoPostBack="true" 
                    OnActiveTabChanged="TabContainer_ActiveTabChanged" >
                        <ajaxToolkit:TabPanel runat="server" ID="Panel1" HeaderText="Escritorio">
                            <ContentTemplate>
                        
                            </ContentTemplate>
                        </ajaxToolkit:TabPanel>
                        <ajaxToolkit:TabPanel runat="server" ID="pnlProveedores" HeaderText="Proveedores">
                            <ContentTemplate>
                                
                                <%--<uc:Proveedores runat="server" ID="UCProveedores1" />--%>
    
                            </ContentTemplate>
                        </ajaxToolkit:TabPanel>
                        <ajaxToolkit:TabPanel runat="server" ID="Panel2"  HeaderText="Clientes">
                            <ContentTemplate>
                                
                                <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
                            </ContentTemplate>
                        </ajaxToolkit:TabPanel>
                        <ajaxToolkit:TabPanel runat="server" ID="TabPanel1" HeaderText="Pedidos" >
                            <ContentTemplate>
                        
                            </ContentTemplate>
                        </ajaxToolkit:TabPanel>
                        <ajaxToolkit:TabPanel runat="server" ID="TabPanel2" HeaderText="Contabilidad">
                            <ContentTemplate>
                        
                            </ContentTemplate>
                        </ajaxToolkit:TabPanel>
                        <ajaxToolkit:TabPanel runat="server" ID="TabPanel3"  HeaderText="Históricos">
                            <ContentTemplate>
                        
                            </ContentTemplate>
                        </ajaxToolkit:TabPanel>
                    </ajaxToolkit:TabContainer>
    
            
            </div>

    If I add the user control in that asp page, it works. The problem is when I add it programmatically in the code behind. Then I can see the user control loaded inside of the tabPanel with its asp button but when I click on it the click doesn´t fire. If I click twice the button disappears.

    Please, let me know if you need anything else in order to help me.

    Many thanks!!!

    Wednesday, October 9, 2013 8:22 AM