3 Replies Latest reply on Oct 5, 2009 11:29 PM by k_krish_rao

    forcing ValueChangeListener method to be invoked in a calend

    k_krish_rao

      I have developed a Organizer kind of application similar to the one in

      http://livedemo.exadel.com/richfaces-demo/richfaces/calendar.jsf?tab=organizer&cid=843345 using rich:calendar

      I also have a valuechangelistener mapped

      valueChangeListener="#{Business_BusinessCalendarBean.valueChanged}"


      In order to display the modal panel on a date that is already selected I have the same workaround that is done in the demo

      <a4j:outputPanel layout="block" id="cell" onclick="#{rich:component('organizer')}.resetSelectedDate()" style="height: 100%;">
       <h:panelGrid columns="1">
       <h:outputText value="{day}" style="align:center"/>
       <h:outputText value="{data.shortDescription.escapeHTML()}"/>
       <h:outputText value="{data.description.escapeHTML()}"/>
       </h:panelGrid>
       </a4j:outputPanel>


      But now the issue is once the date is selected and I click on the same date again the valueChanged() method in the bean is not invoked. How do I make this method to be invoked

        • 1. Re: forcing ValueChangeListener method to be invoked in a ca
          ilya_shaikovsky

          this workaround solves only the issues with request not being sent from the client (because value not changed actually without this code.) But on server side - value change still not actually happens so the listener not fired. You could define action or actionListener at jsFunction instead of valuechangelistener at calendar in order to fire method on every request.

          • 2. Re: forcing ValueChangeListener method to be invoked in a ca
            k_krish_rao

            I changed the calendar as follows

            <a4j:jsFunction name="setdate" action="#{calendarDataModel.valueChanged}" oncomplete="#{rich:component('panel')}.show()">
             <a4j:actionparam name="param1" assignTo="#{calendarDataModel.dateSelected}" />
            </a4j:jsFunction>
            
            <rich:calendar id="businessCalendar" value="#{calendarDataModel.selectedDate}" timeZone="#{calendarBean.timeZone}" datePattern="#{calendarBean.datePattern}" showApplyButton="#{calendarBean.showApply}" popup="#{calendarBean.popup}" enableManualInput="#{calendarBean.manualInput}" dataModel="#{calendarDataModel}" showWeeksBar="false" mode="ajax" cellWidth="50px" cellHeight="50px" validator="#{calendarDataModel.validateDate}" oncurrentdateselected="checkDate(#{calendarDataModel.year});" currentDate="#{calendarDataModel.startDate}">
             <a4j:outputPanel layout="block" id="cell" onclick="setdate({day});" style="height: 100%;">
             <h:panelGrid columns="1">
             <h:outputText value="{day}" style="align:center;font-family: Verdana, Helvetica, Arial, Sans-serif;font-size: 8pt;"/>
             </h:panelGrid>
             </a4j:outputPanel>
             <f:facet name="header">
             <h:panelGrid columns="3" width="100%" columnClasses="fake, width100 talign">
             <h:outputText value="{previousMonthControl}"/>
             <h:outputText value="{currentMonthControl}"/>
             <h:outputText value="{nextMonthControl}"/>
             </h:panelGrid>
             </f:facet>
            </rich:calendar>


            defined each day in an ouputpanel and invoke a jsFunction setdate() on onlick. I want to pass the selected date to this function

            In the setdate() function i want to set the selected date to a member variable dateSelected of type Date in the calendar data model.
            But this does not seem to be working.
            {day} only passed the date as a int. If its Oct 05 then it contains the value 05.

            How can i pass the selected date to a member variable of type Date during onclick event

            • 3. Re: forcing ValueChangeListener method to be invoked in a ca
              k_krish_rao

              Made the following modification to the CalenddarDataModelImpl

              private Date date;
              public CalendarDataModelItem[] getData(Date[] dateArray)
              {
               items = new CalendarDataModelItem[dateArray.length];
               for (int i = 0; i < dateArray.length; i++) {
               items = createDataModelItem(dateArray);
               }
              }
              
              protected CalendarDataModelItem createDataModelItem(Date date)
              {
               CalendarDataModelItemImpl item = new CalendarDataModelItemImpl();
               Map<String, Object> data = new HashMap<String, Object>();
               data.put("date",date);
               Calendar c = Calendar.getInstance();
               c.setTime(date);
               item.setDay(c.get(Calendar.DAY_OF_MONTH));
               item.setData(data);
               return item;
              }
               public Date getDate()
               {
               return date;
               }
              
               public void setDate(Date date)
               {
               this.date = date;
               }
              
              


              In the web page i did the following changes. When i click on the date i try to pass the date in the calendarmodelitems data hashmap to the setdate function. Here I try to assign this to a member variable date of type java.util.Date

              <a4j:jsFunction name="setdate" action="#{calendarDataModel.valueChanged}" oncomplete="#{rich:component('panel')}.show()">
               <a4j:actionparam name="param1" assignTo="#{calendarDataModel.date}" />
              </a4j:jsFunction>
              
              
              <rich:calendar id="businessCalendar" value="#{calendarDataModel.selectedDate}" timeZone="#{calendarBean.timeZone}" datePattern="#{calendarBean.datePattern}" showApplyButton="#{calendarBean.showApply}" popup="#{calendarBean.popup}" enableManualInput="#{calendarBean.manualInput}" dataModel="#{calendarDataModel}" showWeeksBar="false" mode="ajax" cellWidth="50px" cellHeight="50px" validator="#{calendarDataModel.validateDate}" oncurrentdateselected="checkDate(#{calendarDataModel.year});" currentDate="#{calendarDataModel.startDate}">
               <a4j:outputPanel layout="block" id="cell" onclick="setdate({data.date});" style="height: 100%;">
               <h:panelGrid columns="1">
               <h:outputText value="{day}" style="align:center;font-family: Verdana, Helvetica, Arial, Sans-serif;font-size: 8pt;"/>
               </h:panelGrid>
               </a4j:outputPanel>
               <f:facet name="header">
               <h:panelGrid columns="3" width="100%" columnClasses="fake, width100 talign">
               <h:outputText value="{previousMonthControl}"/>
               <h:outputText value="{currentMonthControl}"/>
               <h:outputText value="{nextMonthControl}"/>
               </h:panelGrid>
               </f:facet>
              </rich:calendar>


              When i click on the date I see a message in the firefox error console

              Error: missing ] after element list
              Source File: http://127.0.0.1:9080/RichHolidayCalendar/
              Line: 1, Column: 16
              Source Code:
              setdate([object Object]);