1 Reply Latest reply on Mar 13, 2012 5:44 AM by Junior Joseph

    Calendar as an Organizer.

    Junior Joseph Newbie

      Hi to all,

       

      Have problems with the calendar as an organizer:

       

      1- The previous/next month component does not work

      2- Don't know how to personnally attach my events from the database

      2- How to automatically ask that for example all the fridays from 7:00 am have a special style.

       

      Here is my xhtml file:

       

        • 1. Re: Calendar as an Organizer.
          Junior Joseph Newbie

          <ui:composition xmlns="http://www.w3.org/1999/xhtml"

                xmlns:ui="http://java.sun.com/jsf/facelets"

                xmlns:h="http://java.sun.com/jsf/html"

                xmlns:f="http://java.sun.com/jsf/core"

                xmlns:a4j="http://richfaces.org/a4j"

                xmlns:rich="http://richfaces.org/rich">

               

              <style>

                  .header{

                      font-weight:bold;

                  }

                  .rich-calendar-header{

                      text-align:center;

                  }

                 

                  .organizer-cell {

                      width: 120px;

                      height: 120px;

                      overflow: hidden;

                  }

              </style>

           

              <h:form id="form">

                  <rich:messages/>

                  <a4j:jsFunction name="ajaxSubmit" oncomplete="#{rich:component('panel')}.show()" reRender="editContent" />

                 

                  <rich:calendar

                      id="organizer"

                      value="#{calendarDialog.selectedDate}"

                      popup="false"

                      mode = "ajax"

                      showApplyButton="false"

                      cellWidth="145px"

                      cellHeight="100px"

                      boundaryDatesMode="scroll"

                      showWeeksBar="true"

                      dataModel="#{calendarDataModel}"

                      onchanged="if (event.rich.date) {ajaxSubmit();}"

                      oncurrentdateselect="return true" 

                      valueChangeListener="#{calendarDataModel.valueChanged}"

                      showFooter="true">

                                            

                      <a4j:outputPanel layout="block" id="cell" onclick="#{rich:component('organizer')}.resetSelectedDate()" style="height: 100%;" styleClass="organizer-cell">

                          <div>

                              <h:outputText value="{day}" style="align:center"/>

                          </div>

                          <div>&#xA0;</div>

                          <div>

                              <h:outputText value="{data.shortDescription.escapeHTML()}" />

                          </div>

                          <div>

                              <h:outputText value="{data.description.escapeHTML()}"/>

                          </div>

                      </a4j:outputPanel>

                     

                      <f:facet name="footer">

                          <h:panelGrid columns="7" width="100%">

                               <h:outputText value="{previousYearControl}" style="font-weight:bold;"/>

                               <h:outputText value="{previousMonthControl}" style="font-weight:bold;"/>

                               <h:outputText value="{todayControl}" style="font-weight:bold;"/>

                               <h:outputText value="{selectedDateControl}" style="font-weight:bold;"/>      

                               <h:outputText value="{currentMonthControl}" style="font-weight:bold;"/>      

                               <h:outputText value="{nextMonthControl}" style="font-weight:bold;"/>

                               <h:outputText value="{nextYearControl}" style="font-weight:bold;"/>

                           </h:panelGrid>

                     </f:facet>

                    

                  </rich:calendar>

                 

              </h:form>

             

              <rich:modalPanel id="panel" resizeable="false">

                  <f:facet name="header">Edit Day:</f:facet>

                  <f:facet name="controls">

                      <h:panelGroup>

                          <h:graphicImage value="/images/modal/close.png" id="hidelink" styleClass="hidelink"/>

                          <rich:componentControl for="panel" attachTo="hidelink" operation="hide" event="onclick"/>

                      </h:panelGroup>

                  </f:facet>

                  <h:form>

                      <h:panelGrid columns="2" id="editContent">

                          <h:outputText value="Short Description:"/>

                          <h:inputText value="#{calendarDataModel.currentShortDescription}"/>

                          <h:outputText value="Day Notes:"/>

                          <h:inputTextarea value="#{calendarDataModel.currentDescription}"/>

                          <a4j:commandButton value="Store" action="#{calendarDataModel.storeDayDetails}" id="storebutton" oncomplete="#{rich:component('panel')}.hide()" reRender="organizer"/>

                          <button type="button" id="cancelbutton" onclick="#{rich:component('panel')}.hide()">Cancel</button>

                      </h:panelGrid>

                  </h:form>

              </rich:modalPanel>

          </ui:composition>