L'appel de l'auditeur sur le haricot lorsque vous appuyez sur entrée dans la JSF 2 h:inputText
Je suis en train d'écrire mon premier JSF 2 page et j'aimerais mettre en œuvre les éléments suivants:
Lorsque l'utilisateur écrit quelque chose dans un h:inputText élément et appuie sur le bouton entrer un autre h:inputText devriez obtenir à jour avec des données d'une base de données.
Mon testpage contient le code suivant:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html">
<h:body>
<h3>JSF 2.0 Example</h3>
<h:form>
<h:inputText id="inputField" value="#{helloBean.name}">
<f:ajax render="output" execute="inputField" event="keypress" listener="#{bean.myChangeListener}" />
</h:inputText>
<h2><h:outputText id="output" value="#{helloBean.name}" /></h2>
</h:form>
</h:body>
</html>
La Fève contient tous les getters et les setters et cette fonction:
public void myChangeEvent( AjaxBehaviorEvent event) {
System.out.println( "VALUE CHANGED" );
}
Mise à JOUR 2013-12-16:
Après des heures de dépannage, j'ai trouvé le problème, pourquoi rien n'a été soumis au moment de quitter la zone de texte ou en appuyant sur entrée dans la zone de texte. Mon application web a été créé avec les modèles et le modèle de mon en-tête de page était un "a4j:" au statut de la balise et c'était en conflit avec JSF 2. Après le retrait de la a4j:le statut " en ligne le myChangeEvent méthode est appelée lorsque je clique quelque part sur la page web après la modification de la zone de texte valeur.
Mais il est toujours le problème, que l'ensemble de la page est présentée en cliquant sur entrer après la modification de la zone de texte valeur. C'est parce que j'ai un bouton au bas de la page c'est enregistre l'entrée de l'utilisateur et, par conséquent, fait valoir l'ensemble de la page, ce qui est OK. Mais ce bouton ne doit pas être appelé en appuyant sur entrée dans la zone de texte. Que dois-je ajouter à mon code?
Mise à JOUR 2013-12-17:
Après quelques ennuis avec JS j'ai finalement obtenu le travail avec l'aide de la L-Ray (encore merci).
Ici je vais vous montrer le dernier et la version de travail avec JQuery:
<h:inputText id="inputField" value="#{helloBean.name}" >
<f:ajax render="output" execute="inputField" event="change" listener="#{helloBean.myChangeEvent}" />
</h:inputText>
<h2><h:outputText id="output" value="#{helloBean.name}" /></h2>
<script type="text/javascript">
$(document).ready(function() {
$( "#mainForm\\:inputField" ).bind('keypress', function(e) {
var keyCcode = e.keyCode || e.which;
//Enter was pressed
if(keyCcode == 13) {
e.target.blur();
e.stopPropagation();
return false;
} else {
return true;
}
});
});
</script>
listener
attribut sur <f:ajax>
une faute de frappe?Oh, je suis désolé, c'était une copie n coller erreur, mais encore de l'auditeur (le myChangeListener méthode du bean) n'est pas appelé
Standard dit que le changement de port d'écoute des besoins de la signature
public void processAjaxBehavior(javax.faces.event.AjaxBehaviorEvent event) throws javax.faces.event.AbortProcessingException)
. Ne l'adaptation de votre auditeur à résoudre le problème?J'ai essayé le AjaxBehaviorEvent et également essayé aucun paramètre, mais le résultat est le même
OriginalL'auteur Metalhead89 | 2013-12-13
Vous devez vous connecter pour publier un commentaire.
Je suggère de ne pas utiliser la
listener="#{bean.myChangeEvent}"
attribut dans lainputText
(il attend leValueChangeEvent
), mais un écouteur d'appel de laf:ajax
, qui attend aucun paramètre ou d'unAjaxBehaviorEvent
.Aussi je suggère de ne pas écouter un keypressed-événement à l'intérieur de la
f:ajax
, mais pour un changement-événement, avec un javascript - touche - événement.Donc comme une solution, peut-être le code suivant peut travailler pour vous...
un managed bean
La
event
de l'objet sera donné dans notre partie javascript par le navigateur lui-même - Si l'exécution de la présente à l'extérieur un sur* - attribut ne fonctionne pas.La méthode javascript
event.stopPropagation()
est un méthode jQuery ou seamingly également une méthode javascript (voir W3C école), prévenir d'autres événements à être appelé couler dans l'arborescence DOM.stopPropagation()
- en appuyant sur<Enter>
va soumettre le formulaire par défaut, l'utilisateur n'a sans doute pas voulu dans ce contexte.+1 maintenant, je sais que l'arrêt propatation dans le plus pur JSF qui je faisais avec
a4j:ajax
facilement dans le passé.Malheureusement, je ne peut pas s'appliquer à votre idée de ma demande, ce week-end parce que je ne suis pas au travail, mais je viens de lancer un programme d'aci-exemple de mkyong.com/jsf2/jsf-2-0-hello-world-example et testé avec cette modification. Chrome vous donne le message suivant: "httpError: Le Transport Http retourné 0 code d'état. C'est généralement le résultat du mélange de l'ajax et des requêtes complètes. C'est généralement indésirable, pour à la fois les performances et l'intégrité des données raisons." Comme mabi dit stopPropagation() envoie le formulaire et cela devrait certainement pas être le cas. Puis-je laisser?
Quand je quitte l'e.stopPropagation() Chrome toujours me dit que je mélange ajax et une demande complète
Ajout d'une description "arrêter la Propagation" de la réponse - c'est une méthode qui empêche les autres actions à exécuter. Partie 2 "return false" prévient la forme présentée. Ne laissez pas l'arrêt de la Propagation, c'est essentiel. 🙂
OriginalL'auteur L-Ray