sapui5 - Cómo acceder a elementos desde un fragmento XML por ID

Question

Estoy trabajando en una aplicación SAPUI5. Tengo una vista XML que contiene un Fragment XML y un Botón para guardar.

El fragmento contiene algunos controles como menú desplegable, campo de texto y una tabla. Cuando presiono el botón Guardar, necesito obtener todas las filas de la tabla y llamar a un servicio de actualización de OData.

El problema está en el método onSave en el controlador de vista. Recibo un error al acceder a la tabla usando su ID. ¿Alguien puede ayudarme y aconsejarme cómo puedo acceder a los controles utilizados en fragmentos por su ID en el controlador?

Aquí está el fragmento de código:

---- Ver

<mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns:core="sap.ui.core" xmlns:form="sap.ui.layout.form" xmlns="sap.m">
  <Page>
    ...
    <form:SimpleForm>
      <core:Fragment id ="fr1" fragmentName="first" type="XML"/>
      <Button id="id1" press="onSave"/>
    </form:SimpleForm>
  </Page>
</mvc:View>

---- Fragmento Definición

<core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core">
  <Table id="tab1" mode="MultiSelect">
    ...
  </Table>
</core:FragmentDefinition>

---- Controlador

sap.ui.controller("view", {
  onSave: function() {
    //var tab = this.getView().byId("tab1"); // Not working
    var tab  = sap.ui.getCore().byId("tab1"); // Not working
  },
  // ...
});

Answer 1

Al mirar el código openui5 en github, parece que el Fragmento delega la generación de identificación local a la vista que contiene si el <Fragment/> sí no tiene una identificación explícita.

Por lo tanto, su código this.getView().byId("tab1") debería funcionar tan pronto como elimine el atributo id="fr1" de su elemento <Fragment/> .

Cuando se usan identificadores explícitos, hay un método estático Fragment.byId () para recuperar el control. Supongo que tienes que usarlo así:

var fragmentId = this.getView().createId("fr1");
var tab = sap.ui.core.Fragment.byId(fragmentId, "tab1");

Answer 2

El acceso a los controles dentro de un fragmento depende de cómo se creó su fragmento en primer lugar. Aquí hay una lista de casos con API respectivas para usar para obtener la referencia de control:

API para usar

this.byId("controlId");

• Cuando se creó el fragmento con una ID de vista :

  sap.ui.xmlfragment(this.getView().getId(), "my.Fragment", this); // deprecated *

  <core:Fragment fragmentName="my.Fragment" type="XML" />
  <!-- View ID will be automatically propagated in XMLView -->

• ID global: "componentId---viewId--controlId" **

this.byId(Fragment.createId("fragmentId", "controlId"));

• Cuando se proporcionaron la ID de vista y una ID de fragmento :

  sap.ui.xmlfragment(this.createId("fragmentId"), "my.Fragment", this); // deprecated *

  <core:Fragment id="fragmentId" fragmentName="my.Fragment" type="XML"/>

• ID global: "componentId---viewId--fragmentId--controlId" **

Fragment.byId("fragmentId", "controlId");

• Cuando solo ID de fragmento :

  sap.ui.xmlfragment("fragmentId", "my.Fragment", this); // deprecated *

• ID global: "fragmentId--controlId"

sap.ui.getCore().byId("controlId");

• Cuando no se dieron identificaciones:

  sap.ui.xmlfragment("my.Fragment", this); // deprecated *
  // All control IDs within the fragment gets registered globally without any prefixes!!

• ID global: "controlId"

*: El sap.ui.*fragment API sap.ui.*fragment está en desuso. Utilice Fragment.load lugar (disponible desde 1.58).

**: La ID del componente no formará parte de la ID global si no se proporcionó una ID estable para la vista. En ese caso, la ID global comienza con la ID de vista generada: "__xmlview0--..." .

Dado

• this : referencia a la instancia del controlador

• Fragment : nombre del parámetro para el módulo resuelto dado por la definición de dependencia

  sap.ui.define([ // or .require
    "sap/ui/core/Fragment",
    // ...
  ], function(Fragment, /*...*/) { /*...*/});

Nota

• Evite concatenar partes de ID o confiar en la sintaxis de la ID global, como se menciona en el comment y en la documentation :

  No confíe en la sintaxis de prefijos específicos porque puede cambiar en algún momento. Utilice siempre métodos como byId() y createId() .

• Considere evitar el uso de las API anteriores cuando la intención es alterar algunos datos que se están utilizando en los controles de fragmentos (por ejemplo, myManuallyAccessedInput.setValue("...") ). En su lugar, utilice el enlace de datos ⇒ Los cambios en el modelo se reflejarán en la interfaz de usuario automáticamente.

Answer 3

Para que funcione sin un ID de fragmento explícito y sin Fragment.byId () estático, utilicé el siguiente fragmento de código:

var prefix = this.getView().createId("").replace("--", "");
var fragment = sap.ui.xmlfragment(prefix, "-- XML fragment name --", this);

después de esto, puede usar this.getView (). byId ("tab1") como con cualquier otro control.