web-dev-qa-db-fra.com

L'auditeur Value Change ne fonctionne pas dans le calendrier de primefaces

J'utilise primefaces 3.2 et JSF 2.0

Mon scénario est que j'ai la date de fichier, la dernière date et la date suivante dans mon formulaire . Lorsque l'utilisateur saisit la date du fichier, je dois mettre à jour la valeur de la date du fichier dans le bean afin qu'elle puisse être utilisée comme date minimale dans la dernière date d'attribut mindate et donc dans la prochaine sélection de date.

Selon mes connaissances, l'auditeur de changement de valeur peut s'exécuter lors de la soumission du formulaire, donc je ne peux pas l'utiliser. J'ai utilisé p: ajax . Mais je ne parviens toujours pas à définir la date du fichier. Comme la date du fichier n'est pas définie, l'utilisateur peut sélectionner la dernière date et la date la plus proche de la date du fichier.

caseMaster.xhtml 

<p:calendar value="#{caseUitility.caseMaster.fileDate}" id="fileDate" effect="fadeIn" pattern="dd/MM/yyyy" readOnlyInputText="true">
    <p:ajax event="change" listener="#{caseUitility.dateChange}"/>
</p:calendar>

<p:calendar value="#{caseUitility.caseMaster.lastDate}" required="true" id="lastDate" effect="fadeIn" pattern="dd/MM/yyyy" readOnlyInputText="true" mindate="#{caseUitility.caseMaster.fileDate}" >
</p:calendar>

CaseUitility.Java 

public void dateChange(ActionEvent ae) {
    System.out.println("File Date: " + caseMaster.getFileDate());
    System.out.println("Hello... I am in DateChange");
}

est-ce que n'importe qui peut me guider ce que je fais mal ici?

ajaxjsf-2primefaces
20
mrugeshthaker

Dans les versions plus récentes de PrimeFaces,SelectEventdevrait être utilisévoir l'extrait de code suivant

<p:calendar id="event" value="#{calendarView.date4}">
    <p:ajax event="dateSelect" listener="#{calendarView.onDateSelect}" update="msgs" />
</p:calendar>

public void onDateSelect(SelectEvent event) {
    FacesContext facesContext = FacesContext.getCurrentInstance();
    SimpleDateFormat format = new SimpleDateFormat("dd/MM/yyyy");
    facesContext.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Date Selected", format.format(event.getObject())));
}

Dans les versions précédentes de primefaces, utilisezDateSelectEvent

<p:ajax event="dateSelect" listener="#{caseUitility.dateChange}"/>

public void dateChange(DateSelectEvent event) {
    Date date = event.getDate();
    System.out.println("File Date: " + date);
    System.out.println("Hello... I am in DateChange");
}
34
Daniel

Vous devriez ajouter une mise à jour à votre p: ajax. J'ai eu des problèmes lors de la sélection d'une date avec le datepicker et lors de la saisie manuelle dans le champ. L'événement de changement n'a pas été déclenché dans les deux sens. J'ai donc utilisé un p: ajax et un f: ajax avec différents événements.

<p:calendar value="#{caseUitility.caseMaster.fileDate}" id="fileDate" effect="fadeIn" pattern="dd/MM/yyyy" readOnlyInputText="true">
    <p:ajax event="dateSelect" listener="#{caseUitility.dateSelect}" update="lastDate"/>
    <f:ajax event="change" execute="@this" render="lastDate" listener="#{caseUitility.dateChange}"/>
</p:calendar>

Et dans la fève

public void dateSelect(DateSelectEvent event) {
    caseMaster.setFileDate(event.getDate());
    System.out.println("File Date: " + caseMaster.getFileDate());
    System.out.println("Hello... I am in DateChange");
}

public void dateChange(AjaxBehaviorEvent event) throws MWSException {
    System.out.println("File Date: " + caseMaster.getFileDate());
    System.out.println("Hello... I am in DateChange");
}

J'espère que cela t'aides

18
roel

Ma solution:

<p:ajax event="change" listener="#{caseUitility.dateChange}"/>

Et dans la fève:

public void dateChange(SelectEvent event) 
{   
      date = (Date)event.getObject();
}
1
user3442685

Utiliser un événement ajax comme dateSelectlike

<p:calendar value="#{caseUitility.caseMaster.fileDate}" id="fileDate" effect="fadeIn" pattern="dd/MM/yyyy" readOnlyInputText="true">
        <p:ajax event="dateSelect" process="@this" update="lastDate" listener="#{caseUitility.dateChange}"/>
</p:calendar>   
<p:calendar value="#{caseUitility.caseMaster.lastDate}" required="true" id="lastDate" effect="fadeIn" pattern="dd/MM/yyyy" readOnlyInputText="true" mindate="#{caseUitility.caseMaster.fileDate}" >
</p:calendar>

Auditeur,

public void dateChange(SelectEvent event) {
    System.out.println("File Date: " + (Date) event.getObject());
    System.out.println("Hello... I am in DateChange");
}

mais gardez à l'esprit que, vous ne devez utiliser aucun autre identifiant de composant dans le processus (signifie que @ n'est pas autorisé dans le processus), sinon l'écouteur ne fonctionnera pas.

0
Annu

Je pense que vous devez envisager de faire ceci:

<p:calendar id="fileDate" value="#{caseUitility.caseMaster.fileDate}" navigator="true" effect="slideDown" mindate="#{caseUitility.today}" readOnlyInputText="true" pattern="dd/MM/yyyy HH:mm" required="true"  showOn="button" autocomplete="false">
    <p:ajax event="focus" listener="#{caseUitility.dateChange}" update="lastDate" />
</p:calendar>

public void dateChange()  {
     System.out.println("File Date: " + caseMaster.getFileDate());
}

Si vous utilisez l'événement "focus", il sera déclenché lors d'un changement ou par dateSelect pour le contrôle du calendrier principal.

0
Agurno

Vous pouvez utiliser onstart et oncomplete (n'apparaît pas dans la doc de primefaces).

J'ai résolu avec ça:

<p:calendar
      id="fromDate"
      value="#{reportBean.fromDate}"
      pattern="dd/MM/yyyy"
      locale="es"
      maxdate="#{reportBean.untilDate}">
      <p:ajax event="dateSelect" 
          onstart="openModal();" 
          oncomplete="closeModal();"  
          update="untilDate div_report"/>
</p:calendar>

Javascript:

function openModal(){
    $('#mdlLoading').modal('open');
}
function closeModal(){
    $('#mdlLoading').modal('close');
}

J'espère que cela aidera quelqu'un!

0
Andres Cárdenas