Ordenar una lista en UI5

Si tenemos una lista en nuestra App de UI5 y queremos ordenarla por cualquiera de los campos que contiene nuestro JSON utilizaremos el modelo Sorter.

Importaremos el modelo Sorter en nuestra app.

sap.ui.define([
		"eventsdata/controller/BaseController",
		"sap/ui/model/json/JSONModel",
		"sap/ui/model/Sorter" // Añadimos el model Sorter
	], function (BaseController, JSONModel, Sorter) {

El modelo acepta 4 parámetros:

path : {String} – El campo por el que queramos ordenar.
descending : {boolean} – true|false. Depende si queremos descente o no.
group : {boolean|function} – Por si queremos agrupar.
function : {function} – Para utilizar una función propia de comparación.

Crearemos el objeto sorter con los criterios que queramos, en este caso ordenaremos por apellido ascendentemente y sin agrupar, fijémonos en los parámetros:

var oSorter = new Sorter({
	path : "apellido",
	descending : false,
	group : false
});

Y aplicamos el modelo a nuestra lista/tabla:

Primero obtenemos el objeto por ID:

var oTable = this.byId("table");

Luego le añadimos el objeto oSorter:

oTable.getBinding("items").sort(oSorter);

Y listo!!

Podríamos ponerlo o al cargar la App o al ejecutar una acción, para ello, deberíamos crear una función como por ejemplo:

orderByLastName : function () {

	// Aquí añadimos el código de Sorter

}

Y en el XML, en el Button correspondiente, le añadimos en el parámetro press el nombre de la función, algo aprecido a:


🙂


Tu opinión es importante para mi, ¿Te ha resultado útil este artículo?

Deja una respuesta

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

*