Modificando nuestro GridView

-
Ahora vamos a realizar algunos cambios a nuestro grid para tener un mejor control sobre sus columnas.
Primero quitaremos la propiedad que genera automáticamente las columnas de nuestro GridView esto para poder cambiar el ancho de nuestras columnas.
Después cambiaremos nuestros CommandFields por TemplateFields, que el funcionamiento es idéntico pero con esta propiedad podremos manipular de mejor manera nuestros botones.
Entonces, nuestro GridView quedará de la siguiente manera.
<asp:GridView ID="dgvListado" runat="server"

    OnRowEditing="dgvListado_RowEditing"
    OnRowUpdating="dgvListado_RowUpdating"
    OnRowCancelingEdit="dgvListado_RowCancelingEdit"
    OnRowDeleting="dgvListado_RowDeleting"                      
    AutoGenerateColumns="false">      
    <%--  AutoGenerateColumns. Quitamos la opción de que el GridView nos genere las columnas --%>
    <Columns>
        <asp:TemplateField>
            <%--  Columna editar --%>
            <ControlStyle Width="15px" Height="15px" />
            <ItemTemplate>
                <asp:ImageButton ID="btnEditar"
                    CommandName="Edit"
                    ImageUrl="~/Imagenes/Editar.ICO"
                    runat="server" />
            </ItemTemplate>
            <EditItemTemplate>
                <asp:ImageButton ID="btnActualizar"
                    CommandName="Update"
                    ImageUrl="~/Imagenes/Actualizar.ICO"
                    runat="server" />
                <asp:ImageButton ID="btnCancelar"
                    CommandName="Cancel"
                    ImageUrl="~/Imagenes/Cancelar.ico"
                    runat="server" />
            </EditItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField >
            <%--  Columna eliminar --%>
            <ControlStyle Width="15px" Height="15px" />
            <ItemTemplate>
                <asp:ImageButton ID="btnEliminar"
                    CommandName="Delete"
                    ImageUrl="~/Imagenes/Eliminar.ico"
                    runat="server" />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField HeaderText="Clave" DataField="Clave" ItemStyle-Width="100px" ReadOnly="true" />
        <asp:BoundField HeaderText="Nombre" DataField="Nombre" ItemStyle-Width="250px" />
        <asp:BoundField HeaderText="Teléfono" DataField="Telefono" ItemStyle-Width="150px" />
    </Columns>
</asp:GridView>


Si están trabajando en visual basic .NET, deben eliminar las siguientes líneas:

OnRowEditing="dgvListado_RowEditing"
OnRowUpdating="dgvListado_RowUpdating"
OnRowCancelingEdit="dgvListado_RowCancelingEdit"
OnRowDeleting="dgvListado_RowDeleting"

Comentarios

Publicar un comentario

Entradas populares de este blog

Agregar registros a un GridView utilizando un DataTable

-
Imagen
Lo que pretendemos lograr es poder agregar registros a un GridView utilizando un DataTable que contenga toda la información que queremos mostrar. Vamos a utilizar tres cajas de texto, uno para ingresar la clave del usuario, uno para ingresar el nombre del usuario y por último uno para ingresar el teléfono del usuario. Utilizaremos un botón para agregar el registro y un GridView donde mostraremos los usuarios que vayamos agregando. Lo primero que debemos hacer es crear el DataTable donde guardaremos la información, haremos la declaración del DataTable en el Page_Load de la página. VB NET Protected Sub Page_Load(...) Handles Me.Load 'Revisamos que no sea un refresh If Not IsPostBack Then 'Creamos el DataTable Dim DT As New DataTable DT.Columns.Add("Clave", Type.GetType("System.String")) DT.Columns.Add("Nombre", Type.GetType("System.String")) DT.Columns.Add("Telefono", Type.GetType("System.String"))...
Leer más

Validar registros de un DataTable

-
Imagen
Ahora lo que vamos a hacer es validar los usuarios que vayamos agregando para evitar tener dos usuarios con la misma clave. Para hacer esto hay varios métodos pero voy a presentar la que me parece es la más fácil de implementar, vamos a utilizar el método Select con el que ya cuentan los DataTables, es decir, vamos a seleccionar los registros que contengan la clave que nosotros vayamos ingresando, si el DataTable nos devuelve registros eso nos indicará que la clave ya esta utilizada, de lo contrario nos dirá que nadie tiene esa clave. Empecemos.... Veamos el siguiente ejemplo, estamos a punto de agregar un usuario con la clave 1, pero si revisan ya existe un usuario con la clave 1. Entonces, con las siguientes líneas de código realizaremos la validación: VB.NET ... 'Leemos el dataTable Dim DT As DataTable = Session("DT") 'Revisamos si ya existe el usuario Dim DR() As DataRow DR = DT.Select("Clave = " & strClave) ...
Leer más

Agregar imágenes a los CommandFields

-
Imagen
Ahora bien, si lo que queremos es que nos salga una imagen en lugar de una leyenda tendremos que hacer lo siguiente. En mi caso, voy a agregar una carpeta llamada Imagenes dentro de mi proyecto, y en esa carpeta voy a agregar cuatro imágenes: Actualizar.ico , Cancelar.ico , Editar.ico y Eliminar.ico Entonces, para asignarle la imagen correspondiente a cada CommandField lo haremos desde codigo de la siguiente manera: VB NET Private Sub ImageCommandFields() 'Editar Dim oEditColumn As CommandField = dgvListado.Columns(0) oEditColumn.ButtonType = System.Web.UI.WebControls.ButtonType.Image oEditColumn.EditImageUrl = "~/Imagenes/Editar.ico" oEditColumn.CancelImageUrl = "~/Imagenes/Cancelar.ico" oEditColumn.UpdateImageUrl = "~/Imagenes/Actualizar.ico" 'Eliminar Dim oDeleteColumn As CommandField = dgvListado.Columns(1) oDeleteColumn.ButtonType = System.Web.UI.WebControls.ButtonType.Image oDeleteColumn.DeleteImageUrl = "~/Imagenes/...
Leer más