[CLOSED] Grid panel issue - Displaying vertically compressed in most of time, the issue is regressive.

  1. #1

    [CLOSED] Grid panel issue - Displaying vertically compressed in most of time, the issue is regressive.

    HI Team,

    I have created the Grid panel to show the Security roles, when the List of security roles are more then the grid panel getting shrinked or compressed vertically, this happening in below scenario :

    • Create the new user with more security roles
    • after save the all details comes to view mode, then when i go to TAB "Security" then i see the grid is vertically compressed.
    • if i do re size of window , and from user list if click "View Security roles" from context menu then the grid comes properly.
    • this issue happens once in 5 or 6 Operation.


    Please see the Grid panel appearance in attachment. sample code is as below.
    //Panel which holds the Grid panel user control
    
    <nxtwc:NxtFitLayout ID="FitLayout1" runat="server">
        <Items>
            <nxtwc:NxtPanel ID="rwlaytusers" runat="server" Border="false" AnchorVertical="100%"
                BodyStyle="background-color: #DFE8F6" AnchorHorizontal="100%" Layout="FitLayout">
                <Items>
                    <ext:TabPanel ID="lytUserDetails" ActiveTabIndex="0" runat="server" Border="false"
                        Title="User Details" AnchorVertical="100%" BodyStyle="background-color: #DFE8F6"
                        DeferredRender="false">
                        <Items>
                            <nxtwc:NxtPanel ID="pnlUserSecSet" runat="server" Title="SecuritySettings" AnchorVertical="100%"
                                AnchorHorizontal="100%" Border="false" BodyStyle="background-color: #DFE8F6"
                                Layout="FitLayout" BodyBorder="false">
                                <Content>
                                    <nxtwuc:UserSecuritySettings ID="UserSecSet" runat="server" />
                                </Content>
                            </nxtwc:NxtPanel>
                            <nxtwc:NxtPanel ID="pnlUserSecRoles" runat="server" Title="SecurityRoles" AnchorVertical="100%"
                                AnchorHorizontal="100%" Border="false" BodyStyle="background-color: #DFE8F6"
                                Layout="FitLayout" BodyBorder="false" Region="Center">
                                <Content>
                                    <nxtwuc:UserSecurityRoles ID="UserSecRoles" runat="server" />
                                </Content>
                            </nxtwc:NxtPanel>
                        </Items>
                        <Listeners>
                            <BeforeTabMenuShow Handler="#{lytUserDetails}.setActiveTab(#{pnlUserDetails});" />
                        </Listeners>
                    </ext:TabPanel>
                </Items>
               
                <Listeners>
                   
            </nxtwc:NxtPanel>
        </Items>
    </nxtwc:NxtFitLayout>

    <Content>
    <nxtwuc:UserSecurityRoles ID="UserSecRoles" runat="server" />
    </Content> code is as below

    
    <%@ Control Language="C#" Inherits="NexiantSuite.NxtWebControls.Controls.NxtViewUserControl"
        ClassName="NexiantSuite.NxtWebUserControls.UserSecurityRoles" %>
    
    <style type="text/css">
        .x-grid3-scroller {overflow-y: scroll;}
    </style>
    
    <nxtwc:NxtStore ID="SecurityRolesStore" runat="server" WarningOnDirty="false" AutoLoad="false">
        <Proxy>
            <nxtwc:NxtHttpProxy Url="/User/GetAssignedSecurityRoles" />
        </Proxy>
        <Reader>
            <nxtwc:NxtJsonReader IDProperty="ID" Root="data" TotalProperty="total">
                <Fields>
                    <nxtwc:NxtRecordField Name="RoleName" />
                    <nxtwc:NxtRecordField Name="CompanyName" />
                    <nxtwc:NxtRecordField Name="LastModifiedBy" />
                </Fields>
            </nxtwc:NxtJsonReader>
        </Reader>
        <BaseParams>
            <nxtwc:NxtParameter Name="userid" Value='Ext.GLOBAL_STORE.SelectedUser' Mode="Raw" />
        </BaseParams>
        <SortInfo Field="RoleName" Direction="ASC" />
        <%--    <Listeners>
            <Load Handler="if(Ext.GLOBAL_STORE.UserMode=='View'){Ext.EventBroker.RaiseEvent('DisableSecurityRoles','');}" />
        </Listeners>--%>
    </nxtwc:NxtStore>
    <nxtwc:NxtStore ID="AvailableRolesStore" runat="server" WarningOnDirty="false" AutoLoad="false">
        <Proxy>
            <nxtwc:NxtHttpProxy Url="/User/GetAvailableSecurityRoles" />
        </Proxy>
        <Reader>
            <nxtwc:NxtJsonReader IDProperty="ID" Root="data" TotalProperty="total">
                <Fields>
                    <nxtwc:NxtRecordField Name="RoleName" />
                    <nxtwc:NxtRecordField Name="CompanyName" />
                    <nxtwc:NxtRecordField Name="Assigned" DefaultValue="false" />
                </Fields>
            </nxtwc:NxtJsonReader>
        </Reader>
        <SortInfo Field="RoleName" Direction="ASC" />
    </nxtwc:NxtStore>
    <nxtwc:NxtStore ID="AssignedRolesStore" WarningOnDirty="false" runat="server" AutoLoad="false">
        <Proxy>
            <nxtwc:NxtHttpProxy Url="/User/GetAssignedSecurityRoles" />
        </Proxy>
        <Reader>
            <nxtwc:NxtJsonReader IDProperty="ID" Root="data" TotalProperty="total">
                <Fields>
                    <nxtwc:NxtRecordField Name="RoleName" />
                    <nxtwc:NxtRecordField Name="CompanyName" />
                    <nxtwc:NxtRecordField Name="Assigned" DefaultValue="true" />
                </Fields>
            </nxtwc:NxtJsonReader>
        </Reader>
        <SortInfo Field="RoleName" Direction="ASC" />
    </nxtwc:NxtStore>
    <nxtwc:NxtFitLayout ID="FitLayout1" runat="server">
        <Items>
            <nxtwc:NxtFormPanel BodyStyle="background-color: #DFE8F6" ID="SecRoles" runat="server"
                AnchorHorizontal="100%" Padding="10" AnchorVertical="100%" BodyBorder="false"
                Border="false">
                <Items>
                    <ext:RowLayout ID="rowlyt" runat="server" AnchorHorizontal="100%" AnchorVertical="100%">
                        <Rows>
                            <ext:LayoutRow RowHeight="1">
                                <nxtwc:NxtPanel ID="pnlViewSecurityRoles" runat="server" AnchorHorizontal="100%"
                                    Border="false" AnchorVertical="100%" Layout="FitLayout" BodyStyle="background-color: #DFE8F6"
                                    ColumnWidth="1" Region = "Center" >
                                    <Items>
                                        <nxtwc:NxtGridPanel runat="server" ID="grdSecurityRoles" StripeRows="true" StoreID="SecurityRolesStore"
                                            Border="true" AnchorHorizontal="100%" AnchorVertical="80%" BodyBorder="true" AutoDataBind="true" 
                                            AutoExpandColumn="LastModifiedBy" Title="AssignedRoles" EnableColumnHide="false" ScrollOffset="1" cls="overflow:auto" AutoDoLayout="true" >
                                            <ColumnModel ID="SecurityRolesModel" DefaultWidth="200" runat="server" >
                                                <Columns>
                                                    <ext:CommandColumn Width="40">
                                                        <Commands>
                                                            <ext:GridCommand CommandName="OpenSecurityRole" Icon="ApplicationGo">
                                                                <ToolTip Text="Role Name" AutoDataBind="true" />
                                                            </ext:GridCommand>
                                                        </Commands>
                                                    </ext:CommandColumn>
                                                    <ext:Column ColumnID="RoleName" Header="RoleName" Tooltip="RoleName" AutoDataBind="true" DataIndex="RoleName" />
                                                    <ext:Column ColumnID="CompanyName" Header="CompanyName" Tooltip="CompanyName" AutoDataBind="true" DataIndex="CompanyName" />
                                                    <ext:Column ColumnID="LastModifiedBy" Header="LMB" Tooltip="LMB" AutoDataBind="true" DataIndex="LastModifiedBy" />
                                                </Columns>
                                            </ColumnModel>
                                            <View>
                                                <ext:GridView AutoFill="true" ForceFit="false"  />
                                            </View>
                                            <Plugins>
                                                <ext:GridFilters runat="server" ID="SecRolesFilter">
                                                    <Filters>
                                                        <ext:StringFilter DataIndex="RoleName" />
                                                        <ext:StringFilter DataIndex="CompanyName" />
                                                        <ext:StringFilter DataIndex="LastModifiedBy" />
                                                    </Filters>
                                                </ext:GridFilters>
                                            </Plugins>
                                            <Listeners>
                                                <Command Fn="UserSecurityRoles.commandHandler" />
                                            </Listeners>
                                        </nxtwc:NxtGridPanel>
                                    </Items>
                                </nxtwc:NxtPanel>
                            </ext:LayoutRow>
                            <ext:LayoutRow RowHeight="1">
                                <nxtwc:NxtPanel Layout="ColumnLayout" ID="pnlEditSecurityRoles" runat="server" Border="false"
                                    ColumnWidth="1" AnchorVertical="100%" AnchorHorizontal="100%" BodyStyle="background-color: #DFE8F6">
                                    <Items>
                                        <ext:ColumnLayout ID="colLayoutEditSecurityRoles" FitHeight="true" runat="server">
                                            <Columns>
                                                <ext:LayoutColumn ColumnWidth="0.5">
                                                    <nxtwc:NxtGridPanel runat="server" Title="AvailableRoles" ID="grdAvailableRoles"
                                                        EnableDragDrop="true" AutoExpandColumn="RoleName" StoreID="AvailableRolesStore"
                                                        DDGroup="firstGridDDGroup" IDMode="Explicit" StripeRows="true" EnableColumnHide="false">
                                                        <ColumnModel ID="cmodAvailableRoles" runat="server">
                                                            <Columns>
                                                                <ext:CommandColumn Width="40" Hideable="false">
                                                                    <Commands>
                                                                        <ext:GridCommand CommandName="OpenSecurityRole" Icon="ApplicationGo">
                                                                            <ToolTip Text="Open Security Role" AutoDataBind="true" />
                                                                        </ext:GridCommand>
                                                                    </Commands>
                                                                </ext:CommandColumn>
                                                                <ext:Column Width="100" ColumnID="RoleName" Header="RoleName" Tooltip="RoleName" AutoDataBind="true"
                                                                    DataIndex="RoleName" />
                                                                <ext:Column Width="100" ColumnID="CompanyName" Header="CompanyName" Tooltip="CompanyName" AutoDataBind="true"
                                                                    DataIndex="CompanyName" />
                                                            </Columns>
                                                        </ColumnModel>
                                                        <SelectionModel>
                                                            <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
                                                        </SelectionModel>
                                                        <View>
                                                            <ext:GridView ForceFit="true" />
                                                        </View>
                                                        <Plugins>
                                                            <ext:GridFilters runat="server" ID="GridFilters1">
                                                                <Filters>
                                                                    <ext:StringFilter DataIndex="RoleName" />
                                                                    <ext:StringFilter DataIndex="CompanyName" />
                                                                </Filters>
                                                            </ext:GridFilters>
                                                        </Plugins>
                                                        <Listeners>
                                                            <Command Fn="UserSecurityRoles.commandHandler" />
                                                        </Listeners>
                                                    </nxtwc:NxtGridPanel>
                                                </ext:LayoutColumn>
                                                <ext:LayoutColumn>
                                                    <nxtwc:NxtPanel ID="pnlAssignment" runat="server" Width="35" Height="300" BodyStyle="background-color: transparent;"
                                                        Border="false" Layout="Anchor">
                                                        <Items>
                                                            <nxtwc:NxtPanel ID="pnlAssignment1" runat="server" Border="false" BodyStyle="background-color: transparent;"
                                                                AnchorVertical="40%" />
                                                            <nxtwc:NxtPanel ID="pnlInnerAssignment" runat="server" Border="false" BodyStyle="background-color: transparent;"
                                                                Padding="5">
                                                                <Items>
                                                                    <nxtwc:NxtButton ID="btnAssign" runat="server" Icon="ResultsetNext" StyleSpec="margin-bottom:2px;">
                                                                        <Listeners>
                                                                            <Click Handler="Assignment.assign(#{grdAvailableRoles}, #{grdAssignedRoles});" />
                                                                        </Listeners>
                                                                        <ToolTips>
                                                                            <ext:ToolTip ID="ToolTip1" runat="server" Title="Add" Html="Add Selected Rows" AutoDataBind="true" />
                                                                        </ToolTips>
                                                                    </nxtwc:NxtButton>
                                                                    <nxtwc:NxtButton ID="btnAssignAll" runat="server" Icon="ResultsetLast" StyleSpec="margin-bottom:2px;">
                                                                        <Listeners>
                                                                            <Click Handler="Assignment.assignAll( #{grdAvailableRoles}, #{grdAssignedRoles});" />
                                                                        </Listeners>
                                                                        <ToolTips>
                                                                            <ext:ToolTip ID="ToolTip2" runat="server" Title="Add All" Html="Add All Rows" AutoDataBind="true" />
                                                                        </ToolTips>
                                                                    </nxtwc:NxtButton>
                                                                    <nxtwc:NxtButton ID="btnUnassign" runat="server" Icon="ResultsetPrevious" StyleSpec="margin-bottom:2px;">
                                                                        <Listeners>
                                                                            <Click Handler="Assignment.unassign(#{grdAvailableRoles}, #{grdAssignedRoles});" />
                                                                        </Listeners>
                                                                        <ToolTips>
                                                                            <ext:ToolTip ID="ToolTip3" runat="server" Title="Remove" Html="Remove Selected Rows"
                                                                                AutoDataBind="true" />
                                                                        </ToolTips>
                                                                    </nxtwc:NxtButton>
                                                                    <nxtwc:NxtButton ID="btnUnassignAll" runat="server" Icon="ResultsetFirst" StyleSpec="margin-bottom:2px;">
                                                                        <Listeners>
                                                                            <Click Handler="Assignment.unassignAll(#{grdAvailableRoles}, #{grdAssignedRoles});" />
                                                                        </Listeners>
                                                                        <ToolTips>
                                                                            <ext:ToolTip ID="ToolTip4" runat="server" Title="Remove All" Html="Remove All Rows"
                                                                                AutoDataBind="true" />
                                                                        </ToolTips>
                                                                    </nxtwc:NxtButton>
                                                                </Items>
                                                            </nxtwc:NxtPanel>
                                                        </Items>
                                                    </nxtwc:NxtPanel>
                                                </ext:LayoutColumn>
                                                <ext:LayoutColumn ColumnWidth="0.5">
                                                    <nxtwc:NxtGridPanel runat="server" Title="AssignedRoles" ID="grdAssignedRoles" EnableDragDrop="true"
                                                        AutoExpandColumn="RoleName" StoreID="AssignedRolesStore" DDGroup="secondGridDDGroup"
                                                        IDMode="Explicit" StripeRows="true" EnableColumnHide="false">
                                                        <ColumnModel ID="cmodAssignedRoles" runat="server">
                                                            <Columns>
                                                                <ext:CommandColumn Width="40" Hideable="false">
                                                                    <Commands>
                                                                        <ext:GridCommand CommandName="OpenSecurityRole" Icon="ApplicationGo">
                                                                            <ToolTip Text="Open Security Role" AutoDataBind="true" />
                                                                        </ext:GridCommand>
                                                                    </Commands>
                                                                </ext:CommandColumn>
                                                                <ext:Column Width="100" ColumnID="RoleName" Header="RoleName" Tooltip="RoleName" AutoDataBind="true"
                                                                    DataIndex="RoleName" />
                                                                <ext:Column Width="100" ColumnID="CompanyName" Header="CompanyName" Tooltip="CompanyName" AutoDataBind="true"
                                                                    DataIndex="CompanyName" />
                                                            </Columns>
                                                        </ColumnModel>
                                                        <SelectionModel>
                                                            <ext:RowSelectionModel ID="RowSelectionModel2" runat="server" />
                                                        </SelectionModel>
                                                        <View>
                                                            <ext:GridView ForceFit="true" />
                                                        </View>
                                                        <Plugins>
                                                            <ext:GridFilters runat="server" ID="GridFilters2">
                                                                <Filters>
                                                                    <ext:StringFilter DataIndex="RoleName" />
                                                                    <ext:StringFilter DataIndex="CompanyName" />
                                                                </Filters>
                                                            </ext:GridFilters>
                                                        </Plugins>
                                                        <Listeners>
                                                            <Command Fn="UserSecurityRoles.commandHandler" />
                                                        </Listeners>
                                                    </nxtwc:NxtGridPanel>
                                                </ext:LayoutColumn>
                                            </Columns>
                                        </ext:ColumnLayout>
                                    </Items>
                                </nxtwc:NxtPanel>
                            </ext:LayoutRow>
                        </Rows>
                    </ext:RowLayout>
                </Items>
                
            </nxtwc:NxtFormPanel>
        </Items>
    </nxtwc:NxtFitLayout>
    <ext:DropTarget ID="DropTarget1" runat="server" Target="={grdAvailableRoles.view.scroller.dom}"
        Group="secondGridDDGroup">
        <NotifyDrop Handler="Assignment.notifyDropLeftGrid(#{grdAssignedRoles},e,data,#{AvailableRolesStore});" />
    </ext:DropTarget>
    <ext:DropTarget ID="DropTarget2" runat="server" Target="={grdAssignedRoles.view.scroller.dom}"
        Group="firstGridDDGroup">
        <NotifyDrop Handler="Assignment.notifyDropRightGrid(#{grdAvailableRoles},e,data,#{AssignedRolesStore});" />
    </ext:DropTarget>
    Attached Thumbnails Click image for larger version. 

Name:	UI Issue_User security roles.jpg 
Views:	122 
Size:	91.8 KB 
ID:	5247  
    Last edited by Daniil; Dec 12, 2012 at 11:14 AM. Reason: [CLOSED]
  2. #2
    Hi @Aparna B,

    I see you set up RowHeight="1" for the both rows. The combined RowHeight of all items must be up to 1.
  3. #3

    Grid panel issue - Displaying vertically compressed in most of time, the issue is regressive.

    Hi Daniil,

    I have done the changes which you have mentioned, but the issue still exist. some time it is coming properly, then after few operation i am getting the same issue.
  4. #4
    I don't see any obvious issues which could causes that problem.

    So, I am afraid we can't help without a runnable sample to reproduce.

    Please prepare a sample following this technique.
    How to prepare a sample

Similar Threads

  1. Replies: 0
    Last Post: May 01, 2012, 9:43 AM
  2. [CLOSED] Grid Panel Grouping Issue
    By jesperhp in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Jan 16, 2012, 6:43 AM
  3. Grid Panel - LinqDataSource Issue
    By kwerbeach in forum 1.x Help
    Replies: 0
    Last Post: Aug 27, 2010, 9:08 PM
  4. Mask issue on grid panel
    By dan182 in forum 1.x Help
    Replies: 10
    Last Post: Jun 17, 2010, 12:20 PM
  5. [CLOSED] Grid Panel Column Issue
    By speedstepmem3 in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jun 07, 2010, 11:01 AM

Tags for this Thread

Posting Permissions