[CLOSED] GridPanel row height problem

  1. #1

    [CLOSED] GridPanel row height problem

    We are having problem on height of grid panel row inside a tab panel. It works properly for grid panel without command column but in case of command column some bottom portion of newly added row is hiding inside the tab panel.

    <%@ Page Language="C#" %>
    
    <%@ Import Namespace="System.Collections.Generic" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
        public class Test
        {
            public int ID { get; set; }
            public string ItemName { get; set; }
            public double Price { get; set; }
    
        }
    
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                this.BindData();
            }
        }
    
        private void BindData()
        {
            this.GridPanel1.Store.Primary.DataSource = this.GetData();
            this.GridPanel1.Store.Primary.DataBind();
        }
    
        private List<Test> GetData()
        {
            return new List<Test> 
            {
                new Test { ID = 1, ItemName = "3m Co", Price = 71.72},
                new Test { ID = 2, ItemName = "Alcoa Inc", Price = 29.01},
                new Test { ID = 3, ItemName = "Altria Group Inc",Price = 29.01},
                
            };
        }
    
    </script>
    <!DOCTYPE html>
    <html>
    <head id="Head1" runat="server">
        <title></title>
        
        <script type="text/javascript">
       
    
          function addItemLineNewRow() {
              var gridItems = null;
              gridItems = <%= GridPanel1.ClientID%>;
              var newRow = new ModelgridItems();
              var rowIndex = gridItems.getStore().data.items.length;
              newRow.data.ID = "";
              newRow.data.ItemName = "";
              newRow.data.Price = "";
              var rowIndex = gridItems.getStore().data.items.length;
              gridItems.getStore().insert(rowIndex, newRow);
              App.TabPanel_ItemLineAndExpenseLine.doLayout();
          };
        
        </script>
    </head>
    <body>
        <form id="Form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        
        <ext:TabPanel ID="TabPanel_ItemLineAndExpenseLine" ActiveIndex="0" runat="server"
            DefaultBorder="false" DefaultPadding="0">
            <Items>
                <ext:Panel ID="Panel_ItemLIne" AutoHeight="true" runat="server" Title="Panel1" Header="False"
                    Border="false">
                    <Listeners>
                    </Listeners>
                    <Content>
                        <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true" Width="600">
                            <Store>
                                <ext:Store ID="Store1" runat="server">
                                    <Model>
                                        <ext:Model ID="Model1" Name="ModelgridItems" runat="server" IDProperty="ID">
                                            <Fields>
                                                <ext:ModelField Name="ID" Type="Int" />
                                                <ext:ModelField Name="ItemName" />
                                                <ext:ModelField Name="Price" Type="Float" />
                                            </Fields>
                                        </ext:Model>
                                    </Model>
                                </ext:Store>
                            </Store>
                            <ColumnModel ID="ColumnModel1" runat="server">
                                <Columns>
                                    <ext:Column ID="Column1" runat="server" Text="ID" DataIndex="ID" Width="35" />
                                    <ext:Column ID="Column2" runat="server" Text="NAME" DataIndex="ItemName" Flex="1">
                                        <Editor>
                                            <ext:TextField ID="TextField1" runat="server" />
                                        </Editor>
                                    </ext:Column>
                                    <ext:Column ID="Column3" runat="server" Text="Price" DataIndex="Price">
                                        <Renderer Format="UsMoney" />
                                        <Editor>
                                            <ext:NumberField ID="NumberField1" runat="server" />
                                        </Editor>
                                    </ext:Column>
                                    <ext:CommandColumn runat="server">
                                        <Commands>
                                            <ext:GridCommand Icon="Delete" CommandName="Delete" />
                                        </Commands>
                                    </ext:CommandColumn>
                                </Columns>
                            </ColumnModel>
                            <View>
                                <ext:GridView ID="GridView1" runat="server" />
                            </View>
                            <SelectionModel>
                                <ext:CellSelectionModel ID="CellSelectionModel1" runat="server" />
                            </SelectionModel>
                        </ext:GridPanel>
                    </Content>
                </ext:Panel>
                <ext:Panel ID="Panel_ExpneseLine" runat="server" Title="Panel2" Header="False" Border="false">
                    <Listeners>
                    </Listeners>
                    <Content>
                    </Content>
                </ext:Panel>
            </Items>
        </ext:TabPanel>
        <ext:Button ID="btnAddRow" runat="server" Icon="Add" Text="Add New Row" Cls="btnblock bluecolor">
            <Listeners>
                <Click Handler="addItemLineNewRow();" />
            </Listeners>
        </ext:Button>
        </form>
    </body>
    </html>
    Attached Thumbnails Click image for larger version. 

Name:	grid_panel_row.png 
Views:	207 
Size:	7.3 KB 
ID:	4266  
    Last edited by Daniil; May 23, 2012 at 8:39 PM. Reason: [CLOSED]
  2. #2
    Hi,

    I can suggest the following CSS to fix it.
    <style type="text/css">
        .row-cmd-cell .x-btn-default-toolbar-small {
            padding: 0px;
        }
    </style>

Similar Threads

  1. WIndow Height Problem
    By threewonders in forum 1.x Help
    Replies: 6
    Last Post: Jun 20, 2011, 7:38 AM
  2. Height layout problem
    By jansssson in forum 1.x Help
    Replies: 3
    Last Post: Jan 26, 2011, 10:04 AM
  3. Problem about gridpanel headerMenu columns height
    By zhangsir199 in forum 1.x Help
    Replies: 0
    Last Post: Nov 17, 2010, 3:04 AM
  4. [CLOSED] gridpanel height and width problem
    By majestic in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Sep 04, 2010, 4:54 PM
  5. [CLOSED] [1.0] Portal height problem
    By tansu in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Dec 12, 2009, 8:28 AM

Tags for this Thread

Posting Permissions