✒️SAP BTPFIORI / Las funciones más utilizadas en SAPUI5 Por Jose Baz Suarez

Selector Alummnos / Empresas

Las funciones más utilizadas en SAPUI5

Las funciones más utilizadas en SAPUI5Las funciones más utilizadas en SAPUI5
1. Introducción

SAPUI5 provee una amplia gama de funciones y métodos predefinidos que facilitan el desarrollo de aplicaciones SAP Fiori.
Estas funciones permiten realizar tareas comunes como acceder a modelos, manipular vistas, manejar mensajes, navegar entre pantallas o trabajar con elementos de interfaz de usuario.

Conocer y aplicar correctamente estas funciones es clave para optimizar el código, mejorar la mantenibilidad y cumplir con los estándares del framework SAPUI5.

2. Funciones principales del framework SAPUI5

A continuación se resumen las funciones más utilizadas en el desarrollo de aplicaciones SAP Fiori con SAPUI5:

🔹 1. this.getView()

Devuelve la vista actual (View) del controlador.
Permite acceder a los controles, modelos o propiedades dentro de la vista.

var oInput = this.getView().byId("idCampo");
🔹 2. this.byId()

Permite obtener un control específico dentro de la vista, utilizando su identificador único (ID).

var oButton = this.byId("btnGuardar"); oButton.setEnabled(false);
🔹 3. this.getOwnerComponent()

Obtiene el componente principal (Component.js) de la aplicación, lo que permite acceder al router, modelos o configuraciones globales.

var oRouter = this.getOwnerComponent().getRouter();
🔹 4. this.getRouter()

Devuelve el enrutador (Router) de la aplicación, utilizado para controlar la navegación entre vistas.

this.getRouter().navTo("Detalle");
🔹 5. this.getModel() / this.setModel()

Permite acceder o asignar modelos de datos (JSON, OData, etc.) a una vista o al componente.

var oModel = this.getView().getModel("productos"); this.getView().setModel(oModel, "productos");
🔹 6. this.getResourceBundle()

Devuelve el archivo de internacionalización (i18n) para acceder a textos traducibles.

var oBundle = this.getOwnerComponent().getModel("i18n").getResourceBundle(); var texto = oBundle.getText("mensajeGuardado");
🔹 7. sap.m.MessageToast.show()

Muestra un mensaje emergente (notificación corta) en la parte inferior de la pantalla.

sap.m.MessageToast.show("Registro guardado correctamente");
🔹 8. sap.m.MessageBox

Permite mostrar mensajes modales con diferentes niveles de severidad (información, error, advertencia, etc.).

sap.m.MessageBox.error("Ha ocurrido un error al guardar los datos."); sap.m.MessageBox.information("Operación realizada con éxito.");
🔹 9. sap.ui.define()

Se utiliza para definir módulos en SAPUI5 y declarar dependencias entre ellos.
Es la base de la modularización del framework.

sap.ui.define([ "sap/ui/core/mvc/Controller" ], function(Controller) { "use strict"; return Controller.extend("mi.app.controller.Main", {}); });
🔹 10. sap.ui.require()

Carga módulos de forma asíncrona, sin bloquear la ejecución principal del programa.

sap.ui.require(["sap/m/MessageBox"], function(MessageBox) { MessageBox.success("Módulo cargado correctamente"); });
3. Otras funciones útiles
Función Descripción breve
this.getView().getModel() Accede al modelo de datos vinculado a la vista.
this.getView().getBindingContext() Devuelve el contexto de enlace actual del modelo.
this.getOwnerComponent().getModel("i18n") Accede al modelo de textos traducibles.
this.byId("control") Busca un control dentro de la vista actual.
sap.ui.getCore().byId("idGlobal") Busca un control en todo el core de la app (fuera del alcance de la vista).
4. Buenas prácticas

  • Utilizar siempre this.getView() y this.byId() dentro de controladores para mantener el alcance local.

  • Centralizar los modelos en el Component.js, para mantenerlos accesibles desde toda la aplicación.

  • Mostrar mensajes al usuario mediante MessageToast o MessageBox, nunca con alert().

  • Usar sap.ui.define() para mantener el código modular y escalable.

  • Nombrar los modelos y vistas de forma clara y coherente.

5. Conclusión

Las funciones básicas de SAPUI5 constituyen la base de la interacción entre la lógica del controlador, la vista y el modelo.
Dominar su uso garantiza un desarrollo más ágil, estructurado y conforme a las mejores prácticas Fiori.

Preguntas de repaso

  1. ¿Qué función se utiliza para acceder al router de la aplicación?
    ✅ this.getRouter()

  2. ¿Qué diferencia hay entre sap.ui.define y sap.ui.require?
    sap.ui.define define módulos y sus dependencias, mientras que sap.ui.require los carga de forma asíncrona.

  3. ¿Qué método se utiliza para mostrar mensajes breves al usuario?
    ✅ sap.m.MessageToast.show()

  4. ¿Qué método permite acceder al archivo i18n para textos traducibles?
    ✅ this.getResourceBundle()

  5. ¿Por qué es importante usar sap.ui.define en lugar de incluir scripts manualmente?
    Porque garantiza la modularidad, evita conflictos y mejora la carga asíncrona de dependencias.

 

Escanear / Compartir

 

 

Sobre el autor

Publicación académica de Jose Rodrigo Baz Suarez, en su ámbito de estudios para la Carrera Consultor SAP BTP Fiori.

SAP SemiSenior

Jose Rodrigo Baz Suarez

Profesión: Analista de Inventarios y Auditoria - Uruguay - Legajo: WX92M

✒️Autor de: 47 Publicaciones Académicas

🎓Egresado del módulo:

Disponibilidad Laboral: FullTime

Presentación:

Analista con experiencia en sap, contabilidad, inventarios y costos. manejo de cierres, balances, reportes y mejoras de procesos administrativos.

Certificación Académica de Jose Baz

✒️+Comunidad Académica CVOSOFT

Continúe aprendiendo sobre el tema "Las funciones más utilizadas en SAPUI5" de la mano de nuestros alumnos.

SAP SemiSenior

Las funciones más utilizadas en SAPUI5 1. Introducción SAPUI5 provee una amplia gama de funciones y métodos predefinidos que facilitan el desarrollo de aplicaciones SAP Fiori. Estas funciones permiten realizar tareas comunes como acceder a modelos, manipular vistas, manejar mensajes, navegar entre pantallas o trabajar con elementos de interfaz de usuario. Conocer y aplicar correctamente estas funciones es clave para optimizar el código, mejorar la mantenibilidad y cumplir con los estándares del framework SAPUI5. 2. Funciones principales del framework SAPUI5 A continuación se resumen las funciones más utilizadas en el desarrollo de aplicaciones SAP Fiori con SAPUI5: 🔹 1. this.getView() Devuelve...

Acceder a esta publicación

Creado y Compartido por: Jose Rodrigo Baz Suarez / Disponibilidad Laboral: FullTime + Carta Presentación

*** CVOSOFT - Nuestros Alumnos - Nuestro Mayor Orgullo como Academia ***

SAP Master

Las funciones mas utilizadas en SAPUI5 sap.ui.getCore(): se usa para acceder al núcleo central del framework SAPUI5, es decir, al objeto que representa el UI5 Core. Este núcleo maneja cosas fundamentales como: El modelo central (modelo de datos) Los controles UI La configuración global La inicialización de la aplicación El manejo de eventos this.getView().byld(id): en SAPUI5 se usa para obtener una referencia directa a un control (por ejemplo, un botón, input, tabla, etc.) que está definido en la vista actual (XML o JS). sap.ui.getCore().applyChanges():...

Acceder a esta publicación

Creado y Compartido por: Claudia Bibiana Monsalve Lopez

*** CVOSOFT - Nuestros Alumnos - Nuestro Mayor Orgullo como Academia ***

1. LAS FUNCIONES PRINCIPALES DE SAPUI5 Para acceder a la informacion de un control podemos usar las funciones: sap.ui.getCore(): devuelve instancia de la app o core. por ejemplo, saber el idioma en que estamos logueados: sap.ui.getCore().getConfiguration().getLanguage(). sap.ui.getCore().byid(id_de_la_vista): devuelve instancia de control SAPUI5 creada con el id de la vista pasado por parametro. this.getView().byId(id): en el controlador de la vista para obtener el controlador con el id Ejemplo this.getView().byId("Nombre").setValue(oFirstName); sap.ui.getCore().applyChanges(): Para realizar y representar cambios inmediatamente para los controles UI5. jQuery.sap.domById(id): Para...

Acceder a esta publicación

Creado y Compartido por: Roberto Hernan Santucho

*** CVOSOFT - Nuestros Alumnos - Nuestro Mayor Orgullo como Academia ***

SAP Expert


Una función CALLBACK en JavaScript es una función que se usa para propagar el resultado de una operación, esta función CALLBACK se pasa como parámetro a otra función y es llamada como un resultado cuando la función completa su operación. Un CALLBACK llamada de vuelta es una función que se ejecuta después que otra lo haga es un mecanismo para asegurar que cierto código no se ejecute hasta que otro allá terminado. Al ser JavaScript un lenguaje orientado a eventos los CALLBACKS son una buena técnica para controlar la sincronía. Los objetos en JavaScript nos ayudan a agrupar información un objeto no es más que un conjunto de propiedades...

Acceder a esta publicación

Creado y Compartido por: Jose Medina / Disponibilidad Laboral: FullTime + Carta Presentación

*** CVOSOFT - Nuestros Alumnos - Nuestro Mayor Orgullo como Academia ***

SAP Expert


1 | Key Functions in SAPUI5 We will explore some of the most commonly used functions and methods in SAPUI5, crucial for developing SAP Fiori applications. Accessing Core Information One important aspect of developing SAPUI5 applications is accessing different elements from any point in the application. For instance, you might need to retrieve a control's value from a view or access data from a model to populate a combobox. sap.ui.getCore(): This function returns an instance of the core of the application. The core can store global information, models, and more. It is the most powerful function at the application level. var language = sap.ui.getCore().getConfiguration().getLanguage(); console.log("Logged in language: " + language);...

Acceder a esta publicación

Creado y Compartido por: Jaime Eduardo Gomez Arango / Disponibilidad Laboral: FullTime + Carta Presentación

*** CVOSOFT - Nuestros Alumnos - Nuestro Mayor Orgullo como Academia ***

SAP Senior

sap.ui.getCore() instancia de la aplicación para saber el idioma sap.ui.getCore().getConfiguration().getLanguage() sap.ui.getCore()byid(id) sap.ui.getCore().applyChanges() jQuyery.sap.domByid(id) JQuery.sap.byId(id) para efectos visuales colores, efectos, tamaños de letras JavaScript para la lógica en los controladores colecciones, matrices, arreglos, arrays. método find callback índice del array método foreach para cada elemento del array map reduce Filter Filtra Sort Ordena .shift elimina el primer elemento .unshift(0nuevo elemento') .push .pop indexOf Los ciclos, bucles o iteraciones contador condición de salida ciclo FOR length while do...

Acceder a esta publicación

Creado y Compartido por: Enrique Gomez

*** CVOSOFT - Nuestros Alumnos - Nuestro Mayor Orgullo como Academia ***

SAP Senior

Funciones más usadas: sap.ui.getcore() => devuelve una instancia de la propia aplicación ej: sap.ui.getcore().getConfiguration().getLanguaje() si queremos saber en que idioma estamos logueados. sap.ui.get.core().byId: se usa para obtener una instancia de control SAPUI5 creada con id, en este caso se debe agregar el ID de la vista this.getView().byId(id); se utiliza en el controlador de la vista para obtener el controlador con el ID que pasamos como parametro sapi.ui.getCore().applyChanges() : se usa para realizar y representar cambios inmediatamente para los controloes UI5 jQuery.sap.domByid(id): se utiliza para obtener cualquier elemento HTML con ID jQuery.sap.byId(id) se utiliza para devoñver...

Acceder a esta publicación

Creado y Compartido por: Detriana Barrios / Disponibilidad Laboral: FullTime + Carta Presentación

 

 

👌Genial!, estos fueron los últimos artículos sobre más de 99.000 publicaciones académicas abiertas, libres y gratuitas compartidas con la comunidad, para acceder a ellas le dejamos el enlace a CVOPEN ACADEMY.

🔎Buscador de Publicaciones:

 

 

No sea Juan... Solo podrá llegar alto si realiza su formación con los mejores!