Load User Control in PanelBarItem on SelectedIndexChanged

2 posts, 0 answers
  1. Ebony Gainey
    Ebony Gainey avatar
    2 posts
    Member since:
    Nov 2009

    Posted 12 Jan 2010 Link to this post

    On my aspx page I have 2 rad combo boxes and a rad panel bar.  When the user selects values from both combo boxes, I want the user control to load.  I have looked at several forums on here and even tried to google it, but nothing works.  Please help me figure out what is going on. 

    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">     
            <AjaxSettings>    
                <telerik:AjaxSetting AjaxControlID="pnlSelect">     
                    <UpdatedControls>    
                        <telerik:AjaxUpdatedControl ControlID="pnlSelect"/>     
                    </UpdatedControls>    
                </telerik:AjaxSetting>    
            </AjaxSettings>    
        </telerik:RadAjaxManager>    
        
    <asp:Panel ID="pnlSelect" runat="server">     
        <asp:HiddenField ID="hfPOId" runat="server" />    
        <table>    
            <tr>    
                <td>    
                    <asp:Label ID="Label1" runat="server" Text="Purchase Order: " CssClass="lbl" />    
                    <telerik:RadComboBox ID="rcbPurchaseOrder" runat="server" Width="250px" Height="150px"    
                        EmptyMessage="Select a Purchase Order" EnableLoadOnDemand="True" ShowMoreResultsBox="true"    
                        EnableVirtualScrolling="true"    
                        OnItemsRequested="rcbPurchaseOrder_ItemsRequested" AutoPostBack="True"      
                        onselectedindexchanged="rcbPurchaseOrder_SelectedIndexChanged" />                         
                </td>    
                <td>    
                    <asp:Label ID="Label2" runat="server" Text="Revision: " CssClass="lbl" />    
                    <telerik:RadComboBox ID="rcbPORevision" runat="server"    
                        EmptyMessage="Select a Revision" AutoPostBack="False"      
                        onselectedindexchanged="rcbPORevision_SelectedIndexChanged" Enabled="false" />                                 
                </td>    
            </tr>    
        </table>    
    </asp:Panel>    
    <br />       
        
    <telerik:RadPanelBar runat="server" ID="RadPanelBar1" Width="100%" Visible="true">     
                <Items>    
                    <telerik:RadPanelItem Text="Purchase Order Information" runat="server">     
                        <Items>    
                                <telerik:RadPanelItem runat="server">     
                                <ItemTemplate>    
                                     
                                </ItemTemplate>    
                            </telerik:RadPanelItem>    
                        </Items>    
                    </telerik:RadPanelItem>    
                    <telerik:RadPanelItem Text="Review">     
                        <Items>    
                            <telerik:RadPanelItem>    
                                <ItemTemplate>    
                                         
                                </ItemTemplate>    
                            </telerik:RadPanelItem>    
                        </Items>    
                    </telerik:RadPanelItem>    
                </Items>    
            </telerik:RadPanelBar>   
     

    private void LoadControl()  
    {  
         Control userControl1 = Page.LoadControl("~/UserControls/PurchaseOrder.ascx");  
         userControl1.ID = "userControl1";  
         RadPanelItem pItem = (RadPanelItem)RadPanelBar1.FindItemByText("Purchase Order Information");  
         pItem.Items[0].Controls.Add(userControl1);  
         pItem.Expanded = true;     
    }  
     
    protected void Page_Load(object sender, EventArgs e)  
    {  
         if (rcbPORevision.SelectedValue != string.Empty && rcbPurchaseOrder.SelectedValue != string.Empty)  
         {   
              LoadControl();  
         }  
    }  
     
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 13 Jan 2010 Link to this post

    Hi Ebony Gainey,

    I have tried another approach to accomplish the same scenario, by invoking ajaxRequest in the event handler after checking if user changed the selection in combobox. Then in the ajaxRequest event add the user control to panelbar item.

    aspx:
     
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest"
        <AjaxSettings> 
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1"
                <UpdatedControls> 
                    <telerik:AjaxUpdatedControl ControlID="RadPanelBar1" /> 
                </UpdatedControls> 
            </telerik:AjaxSetting> 
            <telerik:AjaxSetting AjaxControlID="pnlSelect"
                <UpdatedControls> 
                    <telerik:AjaxUpdatedControl ControlID="pnlSelect" /> 
                </UpdatedControls> 
            </telerik:AjaxSetting> 
        </AjaxSettings> 
    </telerik:RadAjaxManager> 

    javascript:
     
    <script type="text/javascript"
        var check1 = false
        var check2 = false
        function OnClientSelectedIndexChanged1(sender, args) { 
            if (check2) { 
                var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>"); 
                ajaxManager.ajaxRequest(""); 
            } 
            check1 = true
        } 
        function OnClientSelectedIndexChanged2(sender, args) { 
            if (check1) { 
                var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>"); 
                ajaxManager.ajaxRequest(""); 
            } 
            check2 = true
        } 
    </script> 
    Attach OnClientSelectedIndexChanged1 to first RadComboBox and OnClientSelectedIndexChanged2 to second RadComboBox.

    cs:
     
        protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e) 
        { 
            LoadControl();  
        } 

    -Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top