Solución para la Carga de Datos en jsGrid utilizando la Opción "pageLoading"

Resumen del Problema

Al intentar cargar datos en jsGrid utilizando la opción "pageLoading", se presenta un error en el controlador que indica que "this.data is undefined". Esto es porque la estructura de los datos que se recibe no coincide con el formato esperado por jsGrid.

Formato de Datos Esperado

jsGrid espera que los datos de respuesta tengan la siguiente estructura:

{
  data: [ { ..primer elemento.. }, { ..segundo elemento..}, ...],
  itemsCount: n 
}

Datos Proporcionados

El formato de los datos que se reciben en el controlador es el siguiente:

[{"ROW_NUMBER":1,"data":"[{"data":[{"STUDENTPIDM":1,"STUDENTID":111,"STUDENTNAME":"Presley, Elvis","AIDYEAR":"2425","CATEGORY":"Deceased","CATEGORIES":null,"COMMENTS":"Wish he was still here"},{"STUDENTPIDM":2,"STUDENTID":222,"STUDENTNAME":"Monroe, Marilyn","AIDYEAR":"2324","CATEGORY":"Deceased","CATEGORIES":null,"COMMENTS":"Really miss her."},{"STUDENTPIDM":3,"STUDENTID":333,"STUDENTNAME":"Dean, James","AIDYEAR":"2425","CATEGORY":"Deceased","CATEGORIES":null,"COMMENTS":"Cool Actor"}],"itemcount":"3"}]"}
]

Aquí, los datos están anidados dentro de un campo llamado "data", que se encuentra en un objeto dentro de un array.

Solución Propuesta

Para que jsGrid funcione correctamente, es necesario transformar la respuesta del controlador para que cumpla con el formato requerido. Esto implica extraer el contenido del campo "data" y convertirlo en el formato adecuado.

Código Modificado para el Controlador

Aquí se presenta cómo modificar el código del controlador para procesar correctamente la respuesta:

controller: {
    loadData: function (filter) {
        return fetch("/internal/dataPackage.XXXX")
            .then(response => response.json())
            .then(data => {
                // Extraer los datos del primer elemento del array
                const items = JSON.parse(data[0].data);
                return {
                    data: items.data,
                    itemsCount: parseInt(items.itemcount) // Asegurarse de que itemsCount sea un número
                };
            })
            .catch((error) => {
                toastr["error"]("Something went wrong.", "Error");
            });
    }
}

Conclusión

Al aplicar esta modificación en el controlador, se garantiza que los datos se transformen a la estructura que jsGrid espera, eliminando así el error "this.data is undefined". Asegúrate de probar la implementación para verificar que los datos se cargan correctamente.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *