[CLOSED] GridPanel bottom Toolbar is not showing while loading in the form

  1. #1

    [CLOSED] GridPanel bottom Toolbar is not showing while loading in the form

    Hi,

    In a web page I have used same store for 2 grid panels. While loading initially I am showing only one grid panel, and then there is an option to select number of grid panels to show. I have selected 2 from combobox filter to show two grid panels. In this case the second grid panel is not showing bottom toolbar (paging toolbar). Here is the code...

    
    <%@ Page Language="VB" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <script runat="server">
        Dim ctrlCount As Integer
        
        Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
            If Not Ext.Net.X.IsAjaxRequest Then
                Call HideAllControls()
                Call ShowReqControls()
            End If
        End Sub
        
        Public Sub HideAllControls()
            Dim j As Integer
            Dim objFs As New Ext.Net.FieldSet
            Dim ctrlName As String = ""
            For j = 1 To 1
                ctrlName = "fsShare" & j
                objFs = CType(Me.FindControl(ctrlName), Ext.Net.FieldSet)
                objFs.Hide()
            Next
        End Sub
    
        Public Sub ShowReqControls()
            Dim txtField As New Ext.Net.TextField
            Dim txtArea As New Ext.Net.TextArea
            Dim btnEmails As New Ext.Net.Button
            Dim lblMsg As New Ext.Net.Label
            Dim ctrlName As String = ""
            Dim objFs As New Ext.Net.FieldSet
    
            Dim j As Integer
            ctrlCount = 0
            If Not cboTestNumber.SelectedItem.Value Is Nothing Then
                ctrlCount = Val(cboTestNumber.SelectedItem.Value) - 1
            End If
    
            For j = 1 To Val(ctrlCount)
                ctrlName = "fsShare" & j
                objFs = CType(Me.FindControl(ctrlName), Ext.Net.FieldSet)
                objFs.Show()
                ctrlName = "lblMsg" & j
                lblMsg = CType(Me.FindControl(ctrlName), Ext.Net.Label)
                lblMsg.Show()
                ctrlName = "btnGetEmails" & j
                btnEmails = CType(Me.FindControl(ctrlName), Ext.Net.Button)
                btnEmails.Show()
                ctrlName = "txtEmailTo" & j
                txtField = CType(Me.FindControl(ctrlName), Ext.Net.TextField)
                txtField.Show()
                ctrlName = "txtFName" & j
                txtField = CType(Me.FindControl(ctrlName), Ext.Net.TextField)
                txtField.Show()
                ctrlName = "txtLName" & j
                txtField = CType(Me.FindControl(ctrlName), Ext.Net.TextField)
                txtField.Show()
                ctrlName = "txtSubject" & j
                txtField = CType(Me.FindControl(ctrlName), Ext.Net.TextField)
                txtField.Show()
                ctrlName = "txtEmailNote" & j
                txtArea = CType(Me.FindControl(ctrlName), Ext.Net.TextArea)
                txtArea.Show()
            Next
    
        End Sub
        
        Public Sub ShowTestControls(ByVal sender As Object, ByVal e As DirectEventArgs)
            Call HideAllControls()
            ctrlCount = Val(cboTestNumber.SelectedItem.Value) - 1
            Call ShowReqControls()
        End Sub
    </script>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.Net Example</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <ext:ResourceManager ID="resMngr" runat="server" />
        <ext:Store ID="TestShareStore" runat="server">
            <Reader>
                <ext:JsonReader IDProperty="RECORD_ID">
                    <Fields>
                        <ext:RecordField Name="RECORD_ID" />
                        <ext:RecordField Name="TEST_ID" />
                        <ext:RecordField Name="TEST" />
                        <ext:RecordField Name="TEST_DATE" />
                        <ext:RecordField Name="TEST_STATUS" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
            <AutoLoadParams>
                <ext:Parameter Name="start" Value="0" Mode="Raw" />
                <ext:Parameter Name="limit" Value="25" Mode="Raw" />
            </AutoLoadParams>
        </ext:Store>
        <ext:Viewport ID="Viewport1" runat="server" Layout="Border">
            <Items>
                <ext:TabPanel ID="pnlbackground" runat="server" Region="Center" Border="false">
                    <Items>
                        <ext:Panel ID="pnlTests" Title="Share" runat="server" BodyStyle="background-color:#ffffff"
                            Border="false" Layout="BorderLayout">
                            <TopBar>
                                <ext:Toolbar ID="tbLS" runat="server">
                                    <Items>
                                    </Items>
                                </ext:Toolbar>
                            </TopBar>
                            <Items>
                                <ext:Panel ID="pnlCommon" runat="server" Border="false" Region="Center" Layout="BorderLayout"
                                    BodyStyle="background-color:#ffffff">
                                    <Items>
                                        <ext:Panel ID="pnlInputs" runat="server" BodyStyle="background-color:#d9d9d9" Region="Center"
                                            Border="true" AutoScroll="true" Margins="5,5,5,5" Padding="10">
                                            <TopBar>
                                                <ext:Toolbar ID="Toolbar2" runat="server" Height="28">
                                                    <Items>
                                                        <ext:Label ID="lblCount" Text="Select Number of Tests" runat="server">
                                                        </ext:Label>
                                                        <ext:ToolbarSpacer />
                                                        <ext:ComboBox ID="cboTestNumber" runat="server" Width="50" SelectedIndex="0">
                                                            <Items>
                                                                <ext:ListItem Text="1" Value="1" />
                                                                <ext:ListItem Text="2" Value="2" />
                                                            </Items>
                                                            <DirectEvents>
                                                                <Select OnEvent="ShowTestControls">
                                                                    <EventMask ShowMask="true" Msg="Creating Test Controls..." />
                                                                </Select>
                                                            </DirectEvents>
                                                        </ext:ComboBox>
                                                        <ext:ToolbarFill>
                                                        </ext:ToolbarFill>
                                                    </Items>
                                                </ext:Toolbar>
                                            </TopBar>
                                            <Items>
                                                <ext:FieldSet ID="fsShare0" runat="server" Title="Share Test 1" Collapsible="false"
                                                    MonitorResize="true" Height="305" BodyStyle="background-color:#d9d9d9" Margins="5,5,5,5"
                                                    Layout="BorderLayout">
                                                    <Items>
                                                        <ext:Container ID="cFs" runat="server" Region="Center" Layout="ColumnLayout">
                                                            <Items>
                                                                <ext:Container ID="cfsLeft" ColumnWidth="0.39" runat="server" Layout="BorderLayout"
                                                                    Height="300" AnchorHorizontal="100%" StyleSpec="background:#DCEAFB">
                                                                    <Items>
                                                                        <ext:Panel ID="pnlCollapse" runat="server" Region="Center" 
                                                                            Title="" AutoScroll="true" MonitorResize="true" Border="false" Layout="BorderLayout">
                                                                            <Items>
                                                                                <ext:FormPanel ID="pnlEmailDocsLeft0" runat="server" Padding="5" AnchorHorizontal="100%"
                                                                                    Region="Center" BodyStyle="background-color:#d9d9d9" LabelWidth="70" MonitorResize="true"
                                                                                    Border="false">
                                                                                    <Items>
                                                                                        <ext:CompositeField ID="CompositeField1" runat="server" FieldLabel="" LabelAlign="Left">
                                                                                            <Items>
                                                                                                <ext:Label ID="lblMsg0" runat="server" Flex="1" Height="60" Text="You can select email address from contacts below. Selecting multiple contacts will create additional shares.">
                                                                                                </ext:Label>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="cfEmailButton0" runat="server" FieldLabel="">
                                                                                            <Items>
                                                                                                <ext:Button runat="server" ID="btnGetEmails0" Text="Add E-Mail Addresses" Icon="EmailAdd">
                                                                                                    <Listeners>
                                                                                                    </Listeners>
                                                                                                </ext:Button>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="cfEmailto" runat="server" FieldLabel="E-Mail To" LabelAlign="Left">
                                                                                            <Items>
                                                                                                <ext:TextField ID="txtEmailTo0" runat="server" Flex="1">
                                                                                                </ext:TextField>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="cfTextFName" runat="server" FieldLabel="First Name">
                                                                                            <Items>
                                                                                                <ext:TextField ID="txtFName0" runat="server" Flex="1">
                                                                                                </ext:TextField>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="cfTextLName0" runat="server" FieldLabel="Last Name">
                                                                                            <Items>
                                                                                                <ext:TextField ID="txtLName0" runat="server" Flex="1">
                                                                                                </ext:TextField>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="cfSubject" runat="server" FieldLabel="Subject" LabelAlign="Left">
                                                                                            <Items>
                                                                                                <ext:TextField ID="txtSubject0" runat="server" Flex="1">
                                                                                                </ext:TextField>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="cfNotes" runat="server" FieldLabel="Meassage" LabelAlign="Left">
                                                                                            <Items>
                                                                                                <ext:TextArea ID="txtEmailNote0" runat="server" Flex="1" AutoScroll="true" Height="80">
                                                                                                </ext:TextArea>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                    </Items>
                                                                                </ext:FormPanel>
                                                                                                                                                           
                                                                            </Items>
                                                                        </ext:Panel>
                                                                    </Items>
                                                                </ext:Container>
                                                                <ext:Container ID="cEmailSeparator" ColumnWidth="0.01" runat="server" Height="300"
                                                                    AnchorHorizontal="100%" StyleSpec="background:#d9d9d9" MonitorResize="true">
                                                                </ext:Container>
                                                                <ext:Container ID="cEmailRight" ColumnWidth="0.60" runat="server" Layout="BorderLayout"
                                                                    AnchorHorizontal="100%" StyleSpec="background:#d9d9d9" Height="300" MonitorResize="true">
                                                                    <Items>
                                                                        <ext:BoxComponent ID="bxcEmail" runat="server" Height="5">
                                                                        </ext:BoxComponent>
                                                                        <ext:FormPanel ID="pnlShareRight0" runat="server" Layout="BorderLayout" Title="Select Test"
                                                                            Region="Center" BodyStyle="background-color:#ecf5fe">
                                                                            <Items>
                                                                                <ext:GridPanel ID="grdShare0" runat="server" Region="Center" StoreID="TestShareStore"
                                                                                    AutoExpandColumn="TEST" BodyStyle="background-color:#DFE8F6" Border="false"
                                                                                    StripeRows="true">
                                                                                    <SelectionModel>
                                                                                        <ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" runat="server" />
                                                                                    </SelectionModel>
                                                                                    <ColumnModel ID="ColumnModel3" runat="server">
                                                                                        <Columns>
                                                                                            <ext:Column Header="Test Name " DataIndex="TEST">
                                                                                            </ext:Column>
                                                                                            <ext:Column Header="Test Status " DataIndex="TEST_STATUS">
                                                                                            </ext:Column>
                                                                                            <ext:Column Header="Test Date" DataIndex="TEST_DATE">
                                                                                            </ext:Column>
                                                                                        </Columns>
                                                                                    </ColumnModel>
                                                                                    <BottomBar>
                                                                                        <ext:PagingToolbar ID="PagingToolbar0" runat="server" PageSize="25">
                                                                                            <Items>
                                                                                            </Items>
                                                                                        </ext:PagingToolbar>
                                                                                    </BottomBar>
                                                                                </ext:GridPanel>
                                                                            </Items>
                                                                        </ext:FormPanel>
                                                                    </Items>
                                                                </ext:Container>
                                                            </Items>
                                                        </ext:Container>
                                                    </Items>
                                                </ext:FieldSet>
                                                <ext:FieldSet ID="fsShare1" runat="server" Title="Share Test 2" Collapsible="false"
                                                    Padding="5" MonitorResize="true" Height="305" BodyStyle="background-color:#d9d9d9"
                                                    Margins="5,5,5,5" Layout="BorderLayout">
                                                    <Items>
                                                        <ext:Container ID="Container1" runat="server" Region="Center" Layout="ColumnLayout">
                                                            <Items>
                                                                <ext:Container ID="Container2" ColumnWidth="0.39" runat="server" Layout="BorderLayout"
                                                                    Height="300" AnchorHorizontal="100%" StyleSpec="background:#DCEAFB">
                                                                    <Items>
                                                                        <ext:Panel ID="Panel1" runat="server" Region="Center"  Title=""
                                                                            AutoScroll="true" MonitorResize="true" Border="false" Layout="BorderLayout">
                                                                            <Items> 
                                                                            <ext:FormPanel ID="pnlEmailDocsLeft1" runat="server" Padding="5" AnchorHorizontal="100%"
                                                                                    Region="Center" BodyStyle="background-color:#d9d9d9" LabelWidth="70" MonitorResize="true"
                                                                                    Border="false">
                                                                                    <Items>
                                                                                        <ext:CompositeField ID="CompositeField2" runat="server" FieldLabel="" LabelAlign="Left">
                                                                                            <Items>
                                                                                                <ext:Label ID="lblMsg1" runat="server" Flex="1" Height="60" Text="You can select email address from contacts below. Selecting multiple contacts will create additional shares.">
                                                                                                </ext:Label>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="CompositeField3" runat="server" FieldLabel="">
                                                                                            <Items>
                                                                                                <ext:Button runat="server" ID="btnGetEmails1" Text="Add E-Mail Addresses" Icon="EmailAdd">
                                                                                                    <Listeners>
                                                                                                    </Listeners>
                                                                                                </ext:Button>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="CompositeField4" runat="server" FieldLabel="E-Mail To" LabelAlign="Left">
                                                                                            <Items>
                                                                                                <ext:TextField ID="txtEmailTo1" runat="server" Flex="1">
                                                                                                </ext:TextField>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="CompositeField5" runat="server" FieldLabel="First Name">
                                                                                            <Items>
                                                                                                <ext:TextField ID="txtFName1" runat="server" Flex="1">
                                                                                                </ext:TextField>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="CompositeField6" runat="server" FieldLabel="Last Name">
                                                                                            <Items>
                                                                                                <ext:TextField ID="txtLName1" runat="server" Flex="1">
                                                                                                </ext:TextField>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="CompositeField7" runat="server" FieldLabel="Subject" LabelAlign="Left">
                                                                                            <Items>
                                                                                                <ext:TextField ID="txtSubject1" runat="server" Flex="1">
                                                                                                </ext:TextField>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                        <ext:CompositeField ID="CompositeField8" runat="server" FieldLabel="Meassage" LabelAlign="Left">
                                                                                            <Items>
                                                                                                <ext:TextArea ID="txtEmailNote1" runat="server" Flex="1" AutoScroll="true" Height="80">
                                                                                                </ext:TextArea>
                                                                                            </Items>
                                                                                        </ext:CompositeField>
                                                                                    </Items>
                                                                                </ext:FormPanel>                                                                           
                                                                            </Items>
                                                                        </ext:Panel>
                                                                    </Items>
                                                                </ext:Container>
                                                                <ext:Container ID="Container3" ColumnWidth="0.01" runat="server" Height="300" AnchorHorizontal="100%"
                                                                    StyleSpec="background:#d9d9d9" MonitorResize="true">
                                                                </ext:Container>
                                                                <ext:Container ID="Container4" ColumnWidth="0.60" runat="server" Layout="BorderLayout"
                                                                    AnchorHorizontal="100%" StyleSpec="background:#d9d9d9" Height="300" MonitorResize="true">
                                                                    <Items>
                                                                        <ext:BoxComponent ID="BoxComponent1" runat="server" Height="5">
                                                                        </ext:BoxComponent>
                                                                        <ext:FormPanel ID="pnlShareRight1" runat="server" Layout="BorderLayout" Title="Select Test"
                                                                            Region="Center" BodyStyle="background-color:#ecf5fe" Margins="5,5,5,5">
                                                                            <Items>
                                                                                <ext:GridPanel ID="grdShare1" runat="server" Region="Center" StoreID="TestShareStore"
                                                                                    AutoExpandColumn="TEST" BodyStyle="background-color:#DFE8F6" Border="false"
                                                                                    StripeRows="true">
                                                                                    <SelectionModel>
                                                                                        <ext:CheckboxSelectionModel ID="CheckboxSelectionModel2" runat="server" />
                                                                                    </SelectionModel>
                                                                                    <ColumnModel ID="ColumnModel1" runat="server">
                                                                                        <Columns>
                                                                                            <ext:Column Header="Test Name " DataIndex="TEST">
                                                                                            </ext:Column>
                                                                                            <ext:Column Header="Test Status " DataIndex="TEST_STATUS">
                                                                                            </ext:Column>
                                                                                            <ext:Column Header="Test Date" DataIndex="TEST_DATE">
                                                                                            </ext:Column>
                                                                                        </Columns>
                                                                                    </ColumnModel>
                                                                                    <BottomBar>
                                                                                        <ext:PagingToolbar ID="PagingToolbar1" runat="server" PageSize="25">
                                                                                            <Items>
                                                                                            </Items>
                                                                                        </ext:PagingToolbar>
                                                                                    </BottomBar>
                                                                                </ext:GridPanel>
                                                                            </Items>
                                                                        </ext:FormPanel>
                                                                    </Items>
                                                                </ext:Container>
                                                            </Items>
                                                        </ext:Container>
                                                    </Items>
                                                </ext:FieldSet>
                                                <ext:BoxComponent ID="BoxComponent2" Height="5" runat="server" />
                                            </Items>
                                        </ext:Panel>
                                        <ext:Panel ID="pnlGrid" runat="server" Region="South" Collapsible="true" Collapsed="true"
                                            Title="View Existing Conditions" MinHeight="240" Margins="5,5,5,5" BodyStyle="background-color:#d9d9d9">
                                            <Items>
                                            </Items>
                                        </ext:Panel>
                                    </Items>
                                </ext:Panel>
                            </Items>
                        </ext:Panel>
                    </Items>
                </ext:TabPanel>
            </Items>
        </ext:Viewport>
        </form>
    </body>
    </html>
    Last edited by Daniil; Apr 25, 2012 at 10:06 PM. Reason: [CLOSED]
  2. #2
    Hi,

    Please call the DoLayout method for the initially hidden FieldSet.
    ctrlName = "fsShare" & j
    objFs = CType(Me.FindControl(ctrlName), Ext.Net.FieldSet)
    objFs.Show()
    objFs.DoLayout()

Similar Threads

  1. Gridpanel toolbar(top bar and bottom bar) not loading
    By kondareddy1984 in forum 1.x Help
    Replies: 1
    Last Post: Nov 03, 2011, 7:03 PM
  2. [CLOSED] How to set the Toolbar buttons alignment to bottom
    By ISI in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Aug 02, 2011, 1:02 PM
  3. Replies: 2
    Last Post: Feb 25, 2011, 1:21 PM
  4. [CLOSED] [1.0] ComboBox in IE6 - Bottom border not showing
    By danielg in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Nov 17, 2010, 10:13 AM
  5. hide window's bottom toolbar
    By [WP]joju in forum 1.x Help
    Replies: 0
    Last Post: May 06, 2009, 5:59 AM

Tags for this Thread

Posting Permissions