web-dev-qa-db-fra.com

Comment passer des variables JavaScript en tant que paramètres à la méthode d'action JSF?

Je prépare des variables en JavaScript (dans mon cas spécifique, j'aimerais obtenir la position GPS):

function getVars() {
    // ...
    var x = locationInfo.lng; 
    var y = locationInfo.lat;
}

Je voudrais les envoyer à mon bean géré via le bouton de commande ci-dessous:

<h:commandButton value="submit" onclick="getVars()" action="#{bean.submit(x,y)}" />

public void submit(int x, int y) {
    // ...
}

Comment envoyer des variables x et y de JavaScript à la méthode d'action du bean géré JSF?

javascriptjsfparameter-passingmanaged-bean
16
Bubble

Laissez JS les définir comme valeurs d'entrée masquées sous la même forme.

<h:form id="formId">
    <h:inputHidden id="x" value="#{bean.x}" />
    <h:inputHidden id="y" value="#{bean.y}" />
    <h:commandButton value="submit" onclick="getVars()" action="#{bean.submit}" />
</h:form>

function getVars() {
    // ...
    var x = locationInfo.lng; 
    var y = locationInfo.lat;

    document.getElementById("formId:x").value = x;
    document.getElementById("formId:y").value = y;
}

La méthode d'action du bouton de commande pourrait simplement y accéder en tant que propriétés de bean de la manière habituelle.

private int x;
private int y;

public void submit() {
    System.out.println("x: " + x);
    System.out.println("y: " + y);
    // ...
}

// Getters+setters.

Une alternative consiste à utiliser OmniFaces<o:commandScript> ou PrimeFaces<p:remoteCommand> au lieu de <h:commandButton>. Voir aussi a.o. Comment invoquer un bean géré JSF sur un événement HTML DOM en utilisant JavaScript natif?

27
BalusC

Si vous utilisez PrimeFaces, vous pouvez utiliser un champ de saisie caché lié à un bean géré et vous pouvez initialiser sa valeur en utilisant javascript, pour PrimeFaces, le PF La fonction peut être utilisée pour accéder à une variable widget liée à l'entrée cachée, de cette manière:

<script>
function getVars() {
    // ...
    var x = locationInfo.lng; 
    var y = locationInfo.lat;
    PF('wvx').jq.val( lat1 );
    PF('wvy').jq.val( lng1 );
}
<script>

<p:inputText type="hidden" widgetVar="wvx" value="#{bean.x}" />
<p:inputText type="hidden" widgetVar="wvy" value="#{bean.y}" />
3
Jose Manuel Gomez Alvarez