Comparto la segunda parte del curso de ASP.NET MVC & JavaScript realizado en la Empresa HTE donde todo se trabaja en forma desconectada usando en el Servidor mi Serializador de Cadenas y JavaScript en el Cliente, sobre todo Matrices.
1. Curso MVC & JavaScript HTE - Demo 09
En este video se muestra como ordenar columnas en forma desconectada, tanto ascendente como descendente usando matrices en JavaScript.
Para el ejemplo se crean enlaces en la cabecera de la tabla, los cuales permiten ordenar sobre cada campo de la tabla productos, el primer clic ordena en forma ascendente y el segundo ordena en forma descendente mostrándose el símbolo respectivo.
2. Curso MVC & JavaScript HTE - Demo 10
En este video se muestra como paginar registros usando matrices en el cliente usando JavaScript. La paginación consta de enlaces (links) solo con los números de páginas, es decir, una paginación simple.
En este ejemplo se usan botones para los números de paginas, los cuales se ven en forma de círculo, con fondo y color debido al estilo, el cual cambia de apariencia al pasar el mouse (hover).
3. Curso MVC & JavaScript HTE - Demo 11
En este video se muestra como paginar registros usando matrices en el cliente usando JavaScript. La paginación consta de enlaces (links) con los números de páginas y también con 4 botones a los extremos (2 en cada lado) que permiten trabajar por bloques.
Este tipo de paginación es necesaria cuando se tiene muchas páginas y debemos agruparlas por bloques, para poder ver mejor y navegar rápidamente al inicio o al final.
4. Curso MVC & JavaScript HTE - Demo 12
En este video se muestra como hacer todas las operaciones en forma conjunta, es decir, paginar registros, ordenar columnas, filtrar registros y exportar registros a texto y excel todo en el cliente (desconectado) usando matrices en JavaScript.
El ejemplo es con la lista de productos y los datos están paginados y por bloques, también las columnas se pueden ordenar en forma ascendente y descendente, también se puede filtrar por cada campo escribiendo sobre los textos de las cabeceras en cada columna de la tabla y finalmente los datos filtrados se pueden exportar en un archivo de texto o en un archivo de excel.
5. Curso MVC & JavaScript HTE - Demo 13 (Parte 1)
En este video se muestra la primera parte de como realizar un mantenimiento de una tabla, es decir, las operaciones de adicionar, actualizar y eliminar registros.
En el ejemplo se muestra una lista de productos paginada por bloques, la cual se puede ordenar, filtrar, exportar a texto y excel. Si queremos crear un nuevo producto o editar uno existente se mostrará un popup (div dentro de la misma pagina).
Después de adicionar o actualizar un registro se actualiza la lista de productos y se cierra el popup. Finalmente, se puede eliminar desde la lista un registro previa confirmación.
6. Curso MVC & JavaScript HTE - Demo 13 (Parte 2)
En este video se muestra la segunda parte de como realizar un mantenimiento de una tabla, es decir, las operaciones de adicionar, actualizar y eliminar registros.
En el ejemplo se muestra una lista de productos paginada por bloques, la cual se puede ordenar, filtrar, exportar a texto y excel. Si queremos crear un nuevo producto o editar uno existente se mostrará un popup (div dentro de la misma pagina).
Después de adicionar o actualizar un registro se actualiza la lista de productos y se cierra el popup. Finalmente, se puede eliminar desde la lista un registro previa confirmación.
7. Curso MVC & JavaScript HTE - Demo 14 (Parte 1)
En este video se muestra la primera parte de cómo crear una cabecera detalle para una orden usando una sola página, ya que se usa solo 2 divs: uno para la parte principal y otro para las búsquedas.
Los datos de los clientes, empleados y productos para las búsquedas se cargan desde un inicio y se presentan en el mismo popup (div) usando la misma funcionalidad para los 3: filtro, ordenación y paginación, permitiendo seleccionar dando un clic.
También se realiza la validación de la cabecera y los detalles usando JavaScript y mostrando los resultados en un span como viñetas y filas de colores si no están completos los datos del detalle.
Finalmente, se graba la orden usando una cadena que viaja hasta el Procedimiento Almacenado de SQL Server usando un solo comando y una sola conexión. Además se puede imprimir la orden creada usando JavaScript para crear el HTML respectivo.
8. Curso MVC & JavaScript HTE - Demo 14 (Parte 2)
En este video se muestra la segunda parte de cómo crear una cabecera detalle para una orden usando una sola página, ya que se usa solo 2 divs: uno para la parte principal y otro para las búsquedas.
Los datos de los clientes, empleados y productos para las búsquedas se cargan desde un inicio y se presentan en el mismo popup (div) usando la misma funcionalidad para los 3: filtro, ordenación y paginación, permitiendo seleccionar dando un clic.
También se realiza la validación de la cabecera y los detalles usando JavaScript y mostrando los resultados en un span como viñetas y filas de colores si no están completos los datos del detalle.
Finalmente, se graba la orden usando una cadena que viaja hasta el Procedimiento Almacenado de SQL Server usando un solo comando y una sola conexión. Además se puede imprimir la orden creada usando JavaScript para crear el HTML respectivo.
9. Curso MVC & JavaScript HTE - Demo 14 (Parte 3)
En este video se muestra la tercera parte de cómo crear una cabecera detalle para una orden usando una sola página, ya que se usa solo 2 divs: uno para la parte principal y otro para las búsquedas.
Los datos de los clientes, empleados y productos para las búsquedas se cargan desde un inicio y se presentan en el mismo popup (div) usando la misma funcionalidad para los 3: filtro, ordenación y paginación, permitiendo seleccionar dando un clic.
También se realiza la validación de la cabecera y los detalles usando JavaScript y mostrando los resultados en un span como viñetas y filas de colores si no están completos los datos del detalle.
Finalmente, se graba la orden usando una cadena que viaja hasta el Procedimiento Almacenado de SQL Server usando un solo comando y una sola conexión. Además se puede imprimir la orden creada usando JavaScript para crear el HTML respectivo.
