[CLOSED] Hide the last icon in a GridPanel

  1. #1

    [CLOSED] Hide the last icon in a GridPanel

    Hi, I want that the last row doesn't paint the icon to remove the row, for example I have 3 rows, i want to the last row doesnt have the icon, but if i add a new row, this row paints the icon and the fourth row doesnt have the icon, you got it?



    After I to add a new record




        <script type="text/javascript">
            var IdAlimento_Convert = function (valor, registro) {
                return registro.get('RAlimento').Id;
            };
    
            var Nombre_Convert = function (valor, registro) {
                return registro.get('RAlimento').Nombre;
            };
    
            var btnAgregar_Click = function () {
                var store = App.sCompra;
                var total = store.getCount();
                var dt = new Date('1/10/2007 03:05:01 PM GMT-0600');
    
                alimento = new Object();
                alimento.Id = 10 + total;
                alimento.Nombre = "Nombre " + total;
    
                store.add({ Id: total, Fecha: dt, RAlimento: alimento, Cantidad: total, Precio: 203.43 + total, Importe: total * (203.43 + total) });
                console.log(store, total);
            };
    
            //Evento de la columna de acciones
            var ccAcciones_Command = function (columna, comando, registro, fila, opciones) {
                //Eliminar registro
                App.sCompra.removeAt(fila);
            };
    
        </script>
            <ext:ResourceManager ID="rmStoreObject" runat="server" />
    
            <ext:GridPanel
                ID="gpCompra"
                runat="server"
                Height="300"
                Title="Compras">
                <TopBar>
                    <ext:Toolbar ID="tbCompra" runat="server">
                        <Items>
                            <ext:Button ID="btnAgregar" runat="server" Text="Agregar">
                                <Listeners>
                                    <Click Fn="btnAgregar_Click" />
                                </Listeners>
                            </ext:Button>
                        </Items>
                    </ext:Toolbar>
                </TopBar>
                <Store>
                    <ext:Store ID="sCompra" runat="server">
                        <Model>
                            <ext:Model ID="mCompra" runat="server">
                                <Fields>
                                    <ext:ModelField Name="Id" Type="Int" />
                                    <ext:ModelField Name="Fecha" Type="Date" />
                                    <ext:ModelField Name="RAlimento" Type="Object" />
                                    <ext:ModelField Name="IdAlimento" Type="Int">
                                        <Convert Fn="IdAlimento_Convert"/>
                                    </ext:ModelField>
                                    <ext:ModelField Name="Nombre" Type="String">
                                        <Convert Fn="Nombre_Convert"/>
                                    </ext:ModelField>
                                    <ext:ModelField Name="Cantidad" Type="Int" />
                                    <ext:ModelField Name="Precio" Type="Float" />
                                    <ext:ModelField Name="Importe" Type="Float" />
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <ColumnModel>
                    <Columns>
                        <ext:CommandColumn
                            ID="ccAcciones"
                            runat="server"
                            Width="25">
                            <Commands>
                                <ext:GridCommand
                                    Icon="Delete"
                                    CommandName="Borrar">
                                    <ToolTip Text="Borrar" />
                                </ext:GridCommand>
                            </Commands>
                            <Listeners>
                                <Command Fn="ccAcciones_Command" />
                            </Listeners>
                        </ext:CommandColumn>
                        <ext:Column ID="cID" runat="server" Text="ID" DataIndex="Id" />
                        <ext:Column ID="cFecha" runat="server" Text="Fecha" DataIndex="Fecha" />
                        <ext:Column ID="cIDAlimento" runat="server" Text="ID Alimento" DataIndex="IdAlimento" />
                        <ext:Column ID="cNombre" runat="server" Text="Nombre" DataIndex="Nombre" />
                        <ext:Column ID="cCantidad" runat="server" Text="Cantidad" DataIndex="Cantidad" />
                        <ext:Column ID="cPrecio" runat="server" Text="Precio" DataIndex="Precio" />
                        <ext:Column ID="cImporte" runat="server" Text="Importe" DataIndex="Importe" />
                    </Columns>
                </ColumnModel>
            </ext:GridPanel>
            protected void Page_Load(object sender, EventArgs e)
            {
                sCompra.DataSource = Datos();
                sCompra.DataBind();
            }
    
            private List<Compra> Datos()
            {
                List<Compra> lCompra = new List<Compra>();
    
                for (int i = 0; i < 5; i++)
                {
                    Compra oCompra = new Compra();
                    Alimento oAlimento = new Alimento();
    
                    oCompra.Id = i;
                    oCompra.Fecha = DateTime.Now;
                    oCompra.IdAlimento = 10 + i;
                    oCompra.Cantidad = i;
                    oCompra.Precio = (decimal)(203.43 + i);
                    oCompra.Importe = oCompra.Cantidad * oCompra.Precio;
    
                    oAlimento.Id = 10 + i;
                    oAlimento.Nombre = "Nombre " + i;
    
                    oCompra.RAlimento = oAlimento;
    
                    lCompra.Add(oCompra);
                }
    
                return lCompra;
            }
    Attached Thumbnails Click image for larger version. 

Name:	GridPanelIcon01.png 
Views:	10 
Size:	13.9 KB 
ID:	19161   Click image for larger version. 

Name:	GridPanelIcon02.png 
Views:	9 
Size:	15.8 KB 
ID:	19171  
    Last edited by Daniil; Jan 30, 2015 at 1:44 PM. Reason: [CLOSED]
  2. #2
    Hi @osef,

    I cannot run the code without the definitions of the Compra and Alimento classes.

    Also, please make s standalone .aspx test case. That would allows to copy, paste and run the test case almost immediately.

    By a standalone test case I mean a test case like Example (Very Helpful) here:
    Forum Guidelines For Posting New Topics
  3. #3
    This is the code.

    Thank you

    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script runat="server">
            public class GrupoAlimentos
            {
                #region Fields
    
                byte id;
                string nombre;
    
                List<Alimento> ralimento;
    
                #endregion
    
                #region Properties
    
                public byte Id
                {
                    get { return id; }
                    set { id = value; }
                }
    
                public string Nombre
                {
                    get { return nombre; }
                    set { nombre = value; }
                }
    
                public List<Alimento> RAlimento
                {
                    get { return ralimento; }
                    set { ralimento = value; }
                }
    
                #endregion
            }
            
            public class Alimento
            {
                #region Fields
    
                int id;
                string nombre;
                string marca;
                int cantidad;
                string unidadmedida;
    
                GrupoAlimentos rgrupoalimentos;
    
                #endregion
    
                #region Properties
    
                public int Id
                {
                    get { return id; }
                    set { id = value; }
                }
    
                public string Nombre
                {
                    get { return nombre; }
                    set { nombre = value; }
                }
    
                public string Marca
                {
                    get { return marca; }
                    set { marca = value; }
                }
    
                public int Cantidad
                {
                    get { return cantidad; }
                    set { cantidad = value; }
                }
    
                public string UnidadMedida
                {
                    get { return unidadmedida; }
                    set { unidadmedida = value; }
                }
    
                public GrupoAlimentos RGrupoAlimentos
                {
                    get { return rgrupoalimentos; }
                    set { rgrupoalimentos = value; }
                }
    
                #endregion
            }
            
            public class Compra
            {
                #region Fields
    
                int id;
                DateTime fecha;
                int idalimento;
                int cantidad;
                decimal precio;
                decimal importe;
    
                Alimento ralimento;
    
                #endregion
    
                #region Properties
    
                public int Id
                {
                    get { return id; }
                    set { id = value; }
                }
    
                public DateTime Fecha
                {
                    get { return fecha; }
                    set { fecha = value; }
                }
    
                public int IdAlimento
                {
                    get { return idalimento; }
                    set { idalimento = value; }
                }
    
                public int Cantidad
                {
                    get { return cantidad; }
                    set { cantidad = value; }
                }
    
                public decimal Precio
                {
                    get { return precio; }
                    set { precio = value; }
                }
    
                public decimal Importe
                {
                    get { return importe; }
                    set { importe = value; }
                }
    
                public Alimento RAlimento
                {
                    get { return ralimento; }
                    set { ralimento = value; }
                }
    
                #endregion
            }
            
            protected void Page_Load(object sender, EventArgs e)
            {
                sCompra.DataSource = Datos();
                sCompra.DataBind();
            }
    
            private List<Compra> Datos()
            {
                List<Compra> lCompra = new List<Compra>();
    
                for (int i = 0; i < 5; i++)
                {
                    Compra oCompra = new Compra();
                    Alimento oAlimento = new Alimento();
    
                    oCompra.Id = i;
                    oCompra.Fecha = DateTime.Now;
                    oCompra.IdAlimento = 10 + i;
                    oCompra.Cantidad = i;
                    oCompra.Precio = (decimal)(203.43 + i);
                    oCompra.Importe = oCompra.Cantidad * oCompra.Precio;
    
                    oAlimento.Id = 10 + i;
                    oAlimento.Nombre = "Nombre " + i;
    
                    oCompra.RAlimento = oAlimento;
    
                    lCompra.Add(oCompra);
                }
    
                return lCompra;
            }
        </script>
        <script type="text/javascript">
            var IdAlimento_Convert = function (valor, registro) {
                return registro.get('RAlimento').Id;
            };
    
            var Nombre_Convert = function (valor, registro) {
                return registro.get('RAlimento').Nombre;
            };
    
            var btnAgregar_Click = function () {
                var store = App.sCompra;
                var total = store.getCount();
                var dt = new Date('1/10/2007 03:05:01 PM GMT-0600');
    
                alimento = new Object();
                alimento.Id = 10 + total;
                alimento.Nombre = "Nombre " + total;
    
                store.add({ Id: total, Fecha: dt, RAlimento: alimento, Cantidad: total, Precio: 203.43 + total, Importe: total * (203.43 + total) });
                console.log(store, total);
            };
    
            //Evento de la columna de acciones
            var ccAcciones_Command = function (columna, comando, registro, fila, opciones) {
                //Eliminar registro
                App.sCompra.removeAt(fila);
            };
    
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ResourceManager ID="rmStoreObject" runat="server" />
    
            <ext:GridPanel
                ID="gpCompra"
                runat="server"
                Height="300"
                Title="Compras">
                <TopBar>
                    <ext:Toolbar ID="tbCompra" runat="server">
                        <Items>
                            <ext:Button ID="btnAgregar" runat="server" Text="Agregar">
                                <Listeners>
                                    <Click Fn="btnAgregar_Click" />
                                </Listeners>
                            </ext:Button>
                        </Items>
                    </ext:Toolbar>
                </TopBar>
                <Store>
                    <ext:Store ID="sCompra" runat="server">
                        <Model>
                            <ext:Model ID="mCompra" runat="server">
                                <Fields>
                                    <ext:ModelField Name="Id" Type="Int" />
                                    <ext:ModelField Name="Fecha" Type="Date" />
                                    <ext:ModelField Name="RAlimento" Type="Object" />
                                    <ext:ModelField Name="IdAlimento" Type="Int">
                                        <Convert Fn="IdAlimento_Convert"/>
                                    </ext:ModelField>
                                    <ext:ModelField Name="Nombre" Type="String">
                                        <Convert Fn="Nombre_Convert"/>
                                    </ext:ModelField>
                                    <ext:ModelField Name="Cantidad" Type="Int" />
                                    <ext:ModelField Name="Precio" Type="Float" />
                                    <ext:ModelField Name="Importe" Type="Float" />
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <ColumnModel>
                    <Columns>
                        <ext:CommandColumn
                            ID="ccAcciones"
                            runat="server"
                            Width="25">
                            <Commands>
                                <ext:GridCommand
                                    Icon="Delete"
                                    CommandName="Borrar">
                                    <ToolTip Text="Borrar" />
                                </ext:GridCommand>
                            </Commands>
                            <Listeners>
                                <Command Fn="ccAcciones_Command" />
                            </Listeners>
                        </ext:CommandColumn>
                        <ext:Column ID="cID" runat="server" Text="ID" DataIndex="Id" />
                        <ext:Column ID="cFecha" runat="server" Text="Fecha" DataIndex="Fecha" />
                        <ext:Column ID="cIDAlimento" runat="server" Text="ID Alimento" DataIndex="IdAlimento" />
                        <ext:Column ID="cNombre" runat="server" Text="Nombre" DataIndex="Nombre" />
                        <ext:Column ID="cCantidad" runat="server" Text="Cantidad" DataIndex="Cantidad" />
                        <ext:Column ID="cPrecio" runat="server" Text="Precio" DataIndex="Precio" />
                        <ext:Column ID="cImporte" runat="server" Text="Importe" DataIndex="Importe" />
                    </Columns>
                </ColumnModel>
            </ext:GridPanel>
    
        </form>
    </body>
    </html>
  4. #4
    Inspired by this example:
    https://examples2.ext.net/#/GridPane...repare_Toolbar

    <ext:CommandColumn>
        <PrepareToolbar Fn="prepareToolbar" />
    </ext:CommandColumn>
    var prepareToolbar = function(grid, toolbar, rowIndex, record) {
        if (grid.getStore().getCount() - 1 == rowIndex) {
            toolbar.items.get(0).hide();
        }
    };
    var btnAgregar_Click = function () {
        ...
        App.gpCompra.getView().refreshNode(total - 1); // to refresh the penultimate row
    };

Similar Threads

  1. Replies: 6
    Last Post: Nov 30, 2012, 1:54 PM
  2. Replies: 0
    Last Post: Jul 10, 2012, 9:33 AM
  3. Hide Rowexpander expand icon
    By bjones in forum 1.x Help
    Replies: 2
    Last Post: Jan 19, 2012, 12:17 PM
  4. [CLOSED] Icon does not hide on item hide
    By amitpareek in forum 1.x Legacy Premium Help
    Replies: 7
    Last Post: Nov 09, 2011, 7:13 PM
  5. [CLOSED] GridPanel + Icon and/or Label Icon
    By state in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Apr 28, 2009, 2:03 AM

Tags for this Thread

Posting Permissions