Initialize JSF component in custom wizard

[redbull]

Hi,
I'm implementing a custom wizard with 4 steps.
In the first step I need to display some input/output fields and a listbox field containing my Alfresco Groups.
Which JSF component (Modelist, Richlist, other?…the most suitable) should I use in jsp page (related to first step), to show this list box?
and, how do I init it?
Thanks all for the help, as always…

[mitpatoliya]

with each step one jsp is associated so if you are adding one more step you need to create new jsp page.
Now as UI of Alfresco explorer is in jsf you need to use the jsf tags.
To show list box in the you need to create one richlist and and populate it in the managebean of the new jsp page.
as in JSF with each page there is one managebean associated which manage all the properties and components shown on the page.
Also, you need to include the tag library of the JSF to enable the use of jsf components in your new jsp page.

[redbull]

thank you, sure,
I'll try to follow your suggest and when I'll finish I'll post the source code….

[redbull]

Mittal,
I'm trying to start from http://wiki.alfresco.com/wiki/RichList example:

<a:richList viewMode="details" pageSize="5" styleClass="datatable" style="border:thin"
     rowStyleClass="recordSetRow" altRowStyleClass="recordSetRowAlt" width="100%"
     value="#{TestList.rows}" var="r" initialSortColumn="name" initialSortDescending="true">
     <a:column primary="true" width="200">
        <f:facet name="header">
           <a:sortLink label="Name" value="name" mode="case-insensitive" styleClass="header"/>
        </f:facet>
        <f:facet name="large-icon">
           <%– this could be a clickable action image etc. –%>
           <h:graphicImage tooltip="#{r.name}" width="38" height="38" url="/icons/folder_large.png" />
        </f:facet>
        <a:actionLink value="#{r.name}" actionListener="#{TestList.clickNameLink}">
           <f:param name="name" value="#{r.name}" />
        </a:actionLink>
     </a:column>
     
     <a:column>
        <f:facet name="header">
           <a:sortLink label="Created Date" value="created" styleClass="header"/>
        </f:facet>
        <h:outputText value="#{r.created}">
           <f:convertDateTime dateStyle="short" />
        </h:outputText>
     </a:column>
     
     <%– components other than columns added to a RichList will generally
          be rendered as part of the list footer –%>
     <a:dataPager/>
  </a:richList>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

A question: how I define "rows" in my bean? (value="#{TestList.rows}" and which is its type?
(I'm a little confused…)

thank you

[mitpatoliya]

rows are nothing but the list of Nodes only in your bean

[redbull]

I did!
This is the jsp code to define the richList:

<a:richList id="users-list"  viewMode="details" pageSize="10" styleClass="recordSet" headerStyleClass="recordSetHeader" rowStyleClass="recordSetRow" altRowStyleClass="recordSetRowAlt" width="100%" value="#{WizardManager.bean.myUsers}" var="r" 
   initialSortColumn="userName" initialSortDescending="true">

   <%– Primary column with full name –%>
   <a:column primary="true" width="50" style="padding:2px;text-align:left">
      <f:facet name="header">
         <a:sortLink label="#{msg.name}" value="fullName" mode="case-insensitive" styleClass="header" />
      </f:facet>
       <f:facet name="small-icon">  
          <h:graphicImage url="/images/icons/person.gif" />
      </f:facet>
        <a:actionLink value="#{r.fullName}" actionListener="#{WizardManager.bean.clickfullNameLink}">
            <f:param name="fullName" value="#{r.fullName}" />
        </a:actionLink>
   </a:column>

   <%– Username column –%>
      <a:column width="60" style="text-align:left">
         <f:facet name="header">
            <a:sortLink label="#{msg.username}" value="userName" styleClass="header" />
         </f:facet>
            <h:outputText value="#{r.userName}" />
   </a:column>
</a:richList>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

and this is the "myUsers" binding:

   private List<Node> myUsers = Collections.<Node>emptyList();   
   // Bean Getters and Setters
      public List<Node> getmyUsers()
      {
         searchmyUsers();
         return this.myUsers;
      }
………..
………..
      /**
       * @return the list of users Nodes to display
       */
   public String searchmyUsers() {
        FacesContext context = FacesContext.getCurrentInstance();
        UserTransaction tx = null;
        try
        {
           tx = Repository.getUserTransaction(context, true);
           tx.begin();
           // get organization of current user
            String currentUserName = Repository.getServiceRegistry(context).getAuthenticationService().getCurrentUserName();
          MapNode currentUsernode = new MapNode(personService.getPerson(currentUserName));
          Map<String, Object> props_currentUser = currentUsernode.getProperties(); 
          String currentUserOrg = props_currentUser.get("organization").toString().trim().toLowerCase();
          // get all APPROVER group users
           final Set<String> authorities = authorityService.getContainedAuthorities(AuthorityType.USER,   GROUP_"+Constants.GROUP_APPROVER,false);
           this.myUsers = new ArrayList<Node>(authorities.size());

           // authorities contains [username1, username2,….] 
           for (final String authority : authorities) {
              MapNode node = new MapNode(personService.getPerson(authority));
              // set data binding properties
              Map<String, Object> props = node.getProperties(); 
              // add user only if its organization is the same of the current user
              String UserOrg = props.get("organization").toString().trim().toLowerCase();
              if (UserOrg.compareTo(currentUserOrg) == 0){
                 // node ok, same organization: I add it to the list
                 String firstName = (String)props.get("firstName");
                 String lastName = (String)props.get("lastName");
                 props.put("fullName", (firstName != null ? firstName : "") + ' ' + (lastName != null ? lastName : ""));
                 this.myUsers.add(node);
                  }
           }
           // commit the transaction
           tx.commit();
        }
        catch (InvalidNodeRefException refErr)
        {
           Utils.addErrorMessage(MessageFormat.format(Application.getMessage(
                 context, Repository.ERROR_NODEREF), new Object[] {"root"}) );
           this.myUsers = Collections.<Node>emptyList();
           try { if (tx != null) {tx.rollback();} } catch (Exception tex) {}
        }
        catch (Exception err)
        {
           Utils.addErrorMessage(MessageFormat.format(Application.getMessage(
                 context, Repository.ERROR_GENERIC), err.getMessage()), err );
           this.myUsers = Collections.<Node>emptyList();
           try { if (tx != null) {tx.rollback();} } catch (Exception tex) {}
        }
     return null;
  }
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

and other files to support the customization (faces-config-custom.xml and so on….).
This is the result:
https://www.dropbox.com/s/i92bkbqe0p5jw2a/richList.JPG

I hope this help other Alfresco beginner (like me…)
By.