Jak przekazać zmienne JavaScript jako parametry do metody akcji JSF?

Przygotowuję kilka zmiennych w JavaScript (w moim konkretnym przypadku chciałbym uzyskać lokalizację GPS):

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

Chciałbym wysłać je do mojego managed bean za pomocą poniższego przycisku polecenia:

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

Jak mogę wysłać zmienne x i y z JavaScript do metody działania managed bean JSF?

Author: BalusC, 2015-02-18

3 answers

Niech js ustawi je jako ukryte wartości wejściowe w tej samej formie.

<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;
}

Metoda działania przycisku polecenia może po prostu uzyskać dostęp do nich jako właściwości bean w zwykły sposób.

private int x;
private int y;

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

// Getters+setters.

Alternatywą jest użycie OmniFaces <o:commandScript> lub PrimeFaces <p:remoteCommand> zamiast <h:commandButton>. Zobacz także a. o. Jak wywołać zarządzaną fasolę JSF na zdarzeniu HTML DOM przy użyciu natywnego JavaScript?

 30
Author: BalusC,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 12:31:56

Jeśli używasz PrimeFaces, możesz użyć ukrytego pola wejściowego połączonego z managed bean i zainicjalizować jego wartość za pomocą javascript, dla PrimeFaces, Funkcja PF może być używana do uzyskania dostępu do zmiennej widżetu połączonej z ukrytym wejściem, w ten sposób:

<script type="text/javascript">
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}" />
 5
Author: Jose Manuel Gomez Alvarez,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2019-09-26 16:18:15
<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}" />

 <script>
        function getVars() {

            var x; 
            var yt;

            x=#{bean.x};
            y=#{bean.y};
        }
    </script>
 -3
Author: jonathan gonzalez,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-06-28 16:24:13