Comment appeler managed bean méthodes avec des paramètres via JavaScript

Je développe une application web et j'utilise JSF et PrimeFaces cadres et externes Geo Map API.

L'API Map me donne POI_id quand j'ai cliqué sur un POI sur la carte. Mais ce n'est pas assez pour moi, je veux obtenir des informations à propos de PI à partir d'une servlet et l'afficher dans une fenêtre pop-up. (les champs adresse, nom, numéro de téléphone, etc.).

Donc, j'ai besoin d'envoyer une requête HTTP à la servlet dans mon managed bean lorsque je clique sur le point d'intérêt sur la carte.

Je peux obtenir poi_id, mais je ne peux pas envoyer cet id pour le backend managed bean, afin d'obtenir les informations POI ne semble pas possible.

Comment puis-je envoyer poi_id à mon managed bean et gérer la réponse à afficher dans une fenêtre pop-up?

OriginalL'auteur Tugrul | 2013-09-24

Juste pour ajouter à Kishor (à moitié) réponse, vous avez besoin d'avoir à être mis à jour tous les composants de votre vue (fenêtre pop-up comme vous l'appelez) et ajax-mettre à jour après la demande a été complétée avec succès.

Vous pouvez utiliser la commande à distance pour envoyer la requête AJAX avec un paramètre supplémentaire attaché et ajax-mise à jour de la JSF composant responsable à être une fenêtre pop-up. Comme (pour PrimeFaces 3.x):

<p:remoteCommand name="myRemote" actionListener="#{myBean.listen}" 
                 update="dialog" oncomplete="dlg.show()" />
...
<div onclick="myremote([{name:'poi_id', value:poi_id}]);">...</div>
...
<p:dialog id="dialog" widgetVar="dlg">
    <h:outputText value="#{myBean.address}" />
    ...(display other information)
</p:dialog>

avec

String address;
public void listen(){
    String poi_id = FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap().get("poi_id");
    address = getAddress(poi_id);
}

L'alternative à l'utilisation d'une commande à distance est d'avoir une forme cachée avec un caché d'entrée qui sera utilisé pour transmettre le paramètre à la sauvegarde de la fève, qui peuvent être séparées des autres haricots pour gérer la récupération de l'information nécessaire en fonction de votre poi_id:

<h:form id="poi-form" styleClass="invisible">
    <h:inputHidden id="poi" value="#{poiBean.poi}" />
    <p:commandButton id="info" action="#{poiBean.info}"
                     update="dialog" oncomplete="dlg.show()" />
</h:form>
<div onclick="document.getElementById('poi-form:poi').value = poi_id; 
              document.getElementById('poi-form:info').click();">...</div>
...
<p:dialog id="dialog" widgetVar="dlg">
    <h:outputText value="#{poiBean.address}" />
    ...(display other information)
</p:dialog>

avec

@ManagedBean
@RequestScoped
public class PoiBean {

    private String poi;//getter+setter
    private String address;//getter
    //other properties

    public void listen(){
        address = getAddress(poi);
        //other properties
    }

}

OriginalL'auteur skuntsel

20

Vous pouvez utiliser PrimeFaces de la commande à distance de la composante (<p:remoteCommand>).

RemoteCommand permet l'exécution de la sauvegarde de haricot méthodes et partielle
mise à jour déclenchée par la coutume script côté client.

L'ajouter à la vue de façon suivante:
```
<p:remoteCommand name="myRemote" actionListener="#{myBean.listen}"/>
```
Et de l'utiliser en Javascript comme ceci:
```
<script type="text/javascript">
   myRemote(); //makes a remote call
</script>
```
ou l'appeler à partir d'un gestionnaire d'événement de la sorte:
```
<div onclick="myremote();">...</div>
```
Si vous voulez également que de passer des paramètres au serveur de faire un appel suivant:
```
<script type="text/javascript">
   myRemote([{name:'param1', value:150}, {name:'param2', value:220}]); //makes a remote call with parameters
</script>
```
L'auditeur pourrait être:
```
public void listen(){
    FacesContext context = FacesContext.getCurrentInstance();
    Map<String,String> params = context.getExternalContext().getRequestParameterMap();
    System.out.println(params.get("param1"));
    System.out.println(params.get("param2"));
}
```
L'un des commentaires demandé de renvoyer une Valeur à Javascript.

Bien dans ce cas vous pouvez utiliser Primeface de Contexte De Demande's execute() méthode à exécuter n'importe quel code javascript que vous voulez.
```
RequestContext.getCurrentInstance().execute("your javascript code");
```
J'ai ajouté un cas d'utilisation pour votre bonne réponse et la correction de quelques fautes de frappe. Hésitez pas à revenir à l'original, si vous le souhaitez. +1.
Merci pour votre réponse rapide et de bonne réponse.
Pouvez écouter() renvoie une valeur? Si oui, comment peut-il être utilisé dans les clients de javascript? Ou peut-être qu'il a à être injecté dans un élément HTML?
Voir mise à jour de réponse.

OriginalL'auteur Kishor Prakash

Vous devez vous connecter pour publier un commentaire.