Diferencias

Muestra las diferencias entre dos versiones de la página.

Enlace a la vista de comparación

Ambos lados, revisión anterior Revisión previa
Próxima revisión
Revisión previa
wiki:2.-desarrollo-app:2.3.-codigo:f.-refresh:start [2018/01/31 15:20] – [refreshValue. Sólo el valor.] patriciawiki:2.-desarrollo-app:2.3.-codigo:f.-refresh:start [2021/05/13 13:42] (actual) – [ui.refreshContentSelectedRow] ary
Línea 1: Línea 1:
 +{{indexmenu_n>1}}
 +
 +===== Refresh ===== 
 +\\
 +Para evitar tener que repintar toda la pantalla y puesto que algunas pueden ser bastante complejas, se han implementado herramientas que nos permiten concretar qué propiedades queremos refrescar, de forma que se vuelvan a evaluar las condiciones de visibilidad, colores, márgenes, etc, únicamente para las propiedades especificadas.\\
 +\\
 +<WRAP center round important 70%>
 +En caso de un **FRAME FLOTANTE**, si se refresca un frame, se refrescan sus hijos directos, **NO** los hijos de sus hijos.\\
 +\\
 +Los prop **type="NC"** (**Check**) SIEMPRE refrescan toda la pantalla.\\
 +\\
 +El NODO **<onchange>** NO refresca la pantalla cuando cambia el valor de algún campo, si queremos refrescar la pantalla hemos de especificar el ATRIBUTO onchange="refresh(Propiedades_A_Refrescar)" __en la propiedad que provoca el cambio__.
 +</WRAP>
 +Por lo dicho anteriormente, cuando tenemos un campo de enlace con otra colección (LUPA), hemos de especificar el atributo onchange="refresh(Propiedades_A_Refrescar)" al campo de enlace //IDLOQUESEA// que es el que cambia de valor y provoca el cambio del MAP_ o bien utilizar el método de script ui.refresh "Propiedades_A_Refrescar".\\
 +\\
 +<code xml>
 + <prop name="IDCONCEPTO" type="N" visible="0" mapcol="ClientesConceptos" mapfld="ID" onchange="refresh(MAP_EXPEDIENTE1)"/>
 + <prop name="MAP_EXPEDIENTE1" visible="1" linkedto="IDCONCEPTO" linkedfield="MAP_EXPEDIENTE" type="N">
 +</code>
 +==== Atributos en PROP ====
 +=== onchange ===
 +En los diferentes prop tenemos a nuestra disposición el atributo **onchange** para indicar qué queremos refrescar cuando cambie el valor del prop:
 +<code xml>
 +<!-- Refresca la pantalla completa cuando cambie el valor de la propiedad -->
 +<prop name="PROP1" ... onchange="refresh"/>
 +
 +<!-- Refresca únicamente las propiedades especificadas como parámetro (separadas por comas) -->
 +<prop name="PROP2" ... onchange="refresh(Calendario,Calendariodatos)"/>
 +
 +<!-- Podemos hacer 2 cosas, ejecutar un nodo y posteriormente refrescar 2 propiedades... -->
 +<prop name="PROP3" ... onchange="executeNode(loquesea),refresh(Calendario,Calendariodatos)" />
 +</code>
 +
 +<WRAP center round important 80%>
 + OJO, **onchange="refresh"**, refresca TODA la colección, incluidas las pestañas que no están visibles.
 +</WRAP>
 +
 +=== postonchange ===
 +El postonchange es un atributo que se ejecuta cuando volvemos de una edición con **pushvalue** ó tras editar un registro de un contents.
 +<code xml>
 +<!-- Sólo para Botones y contents. -->
 +
 +<prop name="BOTON1" type="B" ... postonchange="refresh" />
 +
 +<prop name="@CONTENT1" type="Z" ... postonchange="refresh" />
 +
 +</code>
 +
 +<WRAP center round important 80%>
 +En los botones (type="B") y en los contents (type="Z") se puede poner también un atributo **postonchange** que puede tener los mismo valores que se han descrito para el atributo **onchange**.\\
 +\\
 +Éste atributo **postonchange**, define qué queremos hacer cuando volvamos de una ventana de edición lanzada con un pushvalue ó en el caso de un contents, cuando volvemos de editar un registro de éste.
 +</WRAP>
 +
 +==== Atributos en NODO ====
 +En algún nodo que vayamos a ejecutar, podemos especificar que tras la ejecución NO se refresque toda la pantalla (Por defecto se refresca).\\
 +\\
 +=== refresh ===
 +Para que NO refresque toda la pantalla sino que únicamente se refresquen las propiedades que nosotros queramos, se ha de especificar **refresh="false"** como atributo del nodo a ejecutar puesto que por defecto su valor es "true".
 +
 +=== refresh-prop ===
 +En combinación con el atributo refresh="false", hemos de especificar también el atributo **refresh-prop** para indicar las propiedades que queremos refrescar.
 +<code xml>
 +<calculaTotal refresh="false" refresh-prop="MAP_PROP1,MAP_PROP2">
 + ...
 +</calculaTotal>
 +</code>
 +=== refresh-owner ===
 +Si el nodo que se ejecuta está en algún contents, podemos indicarle que refresque **una propiedad del objeto padre** con el atributo **refresh-owner**.\\
 +\\
 +El atributo **refresh-owner** puede especificarse en cualquier nodo de un contents, tales como **<selecteditem>,<auto-selecteditem>,  <ondateselected>, <onpageselected>...**
 +<code xml>
 +<!-- el refresh-owner se aplica a todo aquello que tenga una "colección padre" -->
 +<!-- <ondateselected>  <onpageselected> <auto-selecteditem> <selecteditem>  -->
 +
 +<selecteditem refresh-owner="MAP_NOMBRESEL,@MenuControles" show-wait-dialog="false">
 + ...
 +</selecteditem>
 +</code>
 +=====SCRIPT=====
 +
 +==== Refresh con SCRIPT ====
 +En lugar de hacerlo con atributos en el XML, podemos indicarle el refresco mediante un método script "**refresh**" de <nowiki>AppData </nowiki>.Userinterface, indicando igualmente las propiedades que queremos refrescar.
 +<code javascript>
 + ui.refresh "PROP1,PROP2"   //Si lo hacemos con VBSCRIPT.
 + 
 + ui.refresh("PROP1,PROP2"); //En caso de hacerlo en JAVASCRIPT.
 +</code>
 +
 +==== RefreshAll ====
 +Para evitar tener que indicar por separado todos los prop que queremos refrescar en una vista, se ha implementado el método  <nowiki>RefreshAll </nowiki>, el cual refresca todos los hijos(sólo el primer nivel), de la vista o del frame que se le pase como parámetro.\\
 +\\
 +<code javascript>
 + // Con esto le decimos que refresque todos los hijos contenidos en el Frame "floatingRespuesta"
 + ui.getView(self).refreshAll("floatingRespuesta");
 +</code>
 +==== refreshValue. Sólo el valor ====
 +\\
 +Si lo que cambia es **únicamente el valor** de alguna propiedad y **el aspecto visual no varía** (fuente, visibilidad, colores de primer plano y fondo, etc), podemos utilizar el método "refreshValue" de  <nowiki>AppData </nowiki>.userInterface que es mucho más rápido y eficiente.\\
 +\\
 +<code javascript>
 + ui.refreshValue "PROP1,PROP2"   //Si lo hacemos con VBSCRIPT
 +
 + ui.refreshValue("PROP1,PROP2"); //Si lo hacemos con JAVASCRIPT
 +</code>
 +
 +==== Refresh de un CONTENTS ====
 +Podemos refrescar únicamente un registro de un contents en lugar de refrescar el contents completo. Para ello podemos hacer uso de dos métodos de appData.userInterface, que son ui.refreshContentRow y ui.refreshContentSelectedRow
 +=== ui.refreshContentRow ===
 +En el nodo que vamos a ejecutar, hemos de poner el **refresh="false"** para que NO refresque todo, únicamente lo que nosotros especifiquemos.
 +<code xml>
 +<contentRow refresh="false" >
 + <action name="runscript">
 + <script language="javascript">
 + var mContentUsuarios = self.getContents("ContentUsuarios");
 + mContentUsuarios.loadAll();
 +
 + <-- Con el getItem(1) cogemos el segundo registro del contents, el primero sería el 0. -->
 + var mObjItem = mContentUsuarios.getItem(1);
 +
 + mObjItem.LOGIN = "paquito";
 + mObjItem.MAP_COLORVIEW = "#0000FF";
 +
 + <!-- Los parámetros son el name del prop del contents y el índice en el array de objetos del contents. -->
 + ui.refreshContentRow('@MAP_CONTENT', 1); 
 +
 + </script>
 + </action>
 +</contentRow>
 +</code>
 +
 +=== ui.refreshContentSelectedRow ===
 +\\
 +En el nodo que vamos a ejecutar, hemos de poner el refresh=“false” para que NO refresque todo, únicamente lo que nosotros especifiquemos.\\
 +\\
 +En este caso, se ejecuta en el **selecteditem** del contents, de forma que el único parámetro que tenemos que pasarle es el name del prop del contents que queremos refrescar, NO es necesario pasarle el id del array con la posición del registro que queremos refrescar como era el caso del método anterior, puesto que el selecteditem se ejecuta sobre el registro que ha seleccionado el usuario.\\
 +\\
 +<code xml>
 +<selecteditem refresh="false" show-wait-dialog="false" >
 + <action name="runscript">
 + <script language="javascript">
 + <!-- Cambiamos algunos valores del registro -->
 + self.MAP_COLORVIEW = "#00FF00";
 + //ui.showToast(self.LOGIN);
 + self.LOGIN = "john";
 +
 + <!-- Le decimos que refresque únicamente la fila actual del contents -->
 + ui.refreshContentSelectedRow('@MAP_CONTENT');
 + </script>
 + </action>
 +</selecteditem>
 +</code>
 +
 +<WRAP center round important 80%>
 +Nótese que en los ejemplos de refresco de los contents, únicamente se ha actualizado la apariencia visual en pantalla, en ningún momento se han salvado los datos.
 +</WRAP>