¿Cómo invocar un bean administrado JSF en un evento HTML DOM usando JavaScript nativo?

Resuelto Tiago Vieira Dos Santos asked hace 11 años • 1 respuestas

Necesito ejecutar un método de acción de bean administrado JSF usando ajax durante loadel evento HTML DOM, similar al de jQuery $(document).ready(function() { $.ajax(...) }). Solo puedo usar el JavaScript generado por JSF en este proyecto. ¿Hay alguna manera de hacerlo en JSF nativo? ¿Qué evento puedo usar o qué función JSF ajax puedo usar?

Estoy usando JSF 2.0, Facelets y PrimeFaces.

May 16 '13 20:05 Tiago Vieira Dos Santos

Aceptado

Varias maneras.

Usar <h:commandScript>. Tenga en cuenta que esto sólo está disponible desde JSF 2.3.

 <h:form>
     <h:commandScript name="commandName" action="#{bean.action}" render=":results" />
 </h:form>
 <h:panelGroup id="results">
     ...
 </h:panelGroup>

Puedes invocarlo en JS como se muestra a continuación:

 commandName();

Los parámetros se pueden pasar de la siguiente manera:

 commandName({ name1: "value1", name2: "value2" });

Y obtenido de la siguiente manera:

 String name1 = externalContext.getRequestParameterMap().get("name1"); // value1
 String name2 = externalContext.getRequestParameterMap().get("name2"); // value2

Para invocarlo durante loadel evento, configure autorun="true".

 <h:commandScript ... autorun="true" />

Si estás usando PrimeFaces, usa su <p:remoteCommand>.

 <h:form>
     <p:remoteCommand name="commandName" action="#{bean.action}" update=":results" />
 </h:form>
 <h:panelGroup id="results">
     ...
 </h:panelGroup>

Puedes invocarlo en JS como se muestra a continuación:

 commandName();

Sin embargo, esto no usa JSF nativo jsf.ajax.request(), sino que usa jQuery nativo de PrimeFaces (ya sabes, PrimeFaces es una biblioteca de componentes JSF además de jQuery/UI).

Los parámetros se pueden pasar de la siguiente manera:

 commandName([{ name: "name1", value: "value1" }, { name: "name2", value: "value2" }]);

Y obtenido de la siguiente manera:

 String name1 = externalContext.getRequestParameterMap().get("name1"); // value1
 String name2 = externalContext.getRequestParameterMap().get("name2"); // value2

Para invocarlo durante loadel evento, configure autoRun="true".

 <p:remoteCommand ... autoRun="true" />

Si está utilizando OmniFaces, utilice su archivo <o:commandScript>. El uso es exactamente el mismo que con <h:commandScript>pero luego está disponible para versiones anteriores de JSF 2.x.

Simplemente reemplácelo h:por o:en el primer ejemplo. Nota histórica: se <h:commandScript>basa íntegramente en <o:commandScript>.
Utilice el truco de la "forma oculta" (en realidad, "hack" recibe una mejor redacción para la fealdad).
```
 <h:form id="form" style="display:none;">
     <h:commandButton id="button" action="#{bean.action}">
         <f:ajax render=":results" />
     </h:commandButton>
 </h:form>
 <h:panelGroup id="results">
     ...
 </h:panelGroup>
```
Puedes invocarlo en JS como se muestra a continuación:
```
 document.getElementById("form:button").onclick();
```
Tenga en cuenta la importancia de activar onclick()en lugar de click(). Inmediatamente onclick()invoca la onclickfunción generada, mientras que click()básicamente solo simula la acción de "hacer clic" en el elemento, como si se usara un mouse, lo cual no es compatible con IE, y en algunos navegadores también requiere que el elemento sea realmente interactuable (es decir, que display:nonepueda interactuar). no se utilizará entonces).

Puede pasar parámetros en <h:inputHidden>el mismo formulario que completó con JS de antemano. Esto se demuestra en ¿Cómo pasar variables de JavaScript como parámetros al método de acción JSF?

Para invocarlo durante loadel evento, considere colocarlo en <h:outputScript target="body">. Automáticamente target="body"coloca el <script>final de <body>, por lo que $(document).ready()no es necesario un contenedor.
```
 <h:outputScript target="body">
     document.getElementById("form:button").onclick();
 </h:outputScript>
```
O cree una costumbre UIComponentque extienda UICommandy genere la jsf.ajax.request()llamada nativa JSF necesaria. Como ejemplo, podrías mirar el código fuente de OmniFaces <o:commandScript>.

May 16 '2013 13:05 BalusC