0 Replies Latest reply on Jun 14, 2010 12:32 PM by luisalves00

    Master detail form with AJAX (HtmlAjaxCommandButton)

    luisalves00

      FYI: Spring + JSF 1.1  MyFaces + RichFaces 3.1.6

       

      JSP:

       

      <%-- Properties Form  - the a:panel is a Alfresco tag--%>
      <a:panel id="create-properties-panel" border="innerwhite" bgcolor="white"
          titleBorder="lbgrey" expandedTitleBorder="dotted" titleBgcolor="white"
          styleClass="mainSubTitle" label="#{msg.create_new_type_properties_panel_title}">
          <a4j:outputPanel id="out">
              <h:panelGrid id="propertiesGrid"  columns="1"></h:panelGrid>
          </a4j:outputPanel>
          <a4j:form>
              <a4j:commandButton id="addPropertiesButton" actionListener="#{DialogManager.bean.addNewProperty}" image="#{request.contextPath}/images/icons/add_item_large.gif"  reRender="dialog:dialog-body:out" />
          </a4j:form>
      </a:panel>

       

      BEAN:

       

      public void addNewProperty(ActionEvent event){
              List gridList = FacesContext.getCurrentInstance().getViewRoot().findComponent("dialog:dialog-body:propertiesGrid").getChildren();;
              UIComponent grid = FacesContext.getCurrentInstance().getViewRoot().findComponent("dialog:dialog-body:propertiesGrid");
              HtmlOutputLabel propertyFormLabel;
              HtmlInputText input;
              HtmlInputTextarea inputArea;
              HtmlSelectBooleanCheckbox inputCheck;
              HtmlMessage msg;
              HtmlSelectOneMenu selectBox;
             
              try {       
                  HtmlPanelGrid propertyFormGrid = createPropertyGrid(this.propertiesCount,3,grid);
                
                  //create the ListShuttle
                  HtmlListShuttle ls = new HtmlListShuttle();
                  ls.setSourceListWidth("150");
                  ls.setTargetListWidth("150");
                  ls.setSourceCaptionLabel(Application.getMessage(FacesContext.getCurrentInstance(), "constraints_shuttle_list_available"));
                  ls.setTargetCaptionLabel(Application.getMessage(FacesContext.getCurrentInstance(), "constraints_shuttle_list_selected"));
                  ls.setSourceValue(this.getAvailableConstrains());
                  ls.setVar("item");
                  ls.setTargetValue(this.getSelectedConstrains());
                  HtmlColumn col = new HtmlColumn();    
                  HtmlOutputLabel label = new HtmlOutputLabel();
                  label.setValueBinding("value", FacesContext.getCurrentInstance().getApplication().createValueBinding("#{item.name}"));
                  col.getChildren().add(label);    
                  ls.getChildren().add(col);
                  propertyFormGrid.getChildren().add(ls);
                 
                  //fill the cell
                  createRichSpace("10","10",propertyFormGrid);
                  createRichSpace("10","10",propertyFormGrid);
                  createRichSpace("10","10",propertyFormGrid);
                 
                  //get the request context
                  //final Object request = FacesContext.getCurrentInstance().getExternalContext().getRequest();
                  //String contextpath="";              
                  //if (request instanceof HttpServletRequest) {
                  //    HttpServletRequest svRequest = (HttpServletRequest) request;              
                  //    contextpath = svRequest.getContextPath();   
                  //    logger.info("context path : " + contextpath);
                  //}
                 
                  HtmlAjaxCommandButton removeButton = new HtmlAjaxCommandButton();
                  removeButton.setId("removePropertiesButton-" + this.propertiesCount );
                  removeButton.setImage("/images/icons/remove_item_large.gif");
                  removeButton.setActionListener(FacesContext.getCurrentInstance().getApplication().createMethodBinding("#{DialogManager.bean.removeNewProperty}",
                          new Class[]{ActionEvent.class}));
                  removeButton.setReRender(FacesContext.getCurrentInstance().getViewRoot().findComponent("dialog:dialog-body:out"));   
                  HtmlForm form = new HtmlForm();
                  form.setId("property" + this.propertiesCount + "Form");
                  form.getChildren().add(removeButton);
                  propertyFormGrid.getChildren().add(form);
                 
                  if(gridList != null){
                      //add all created components
                      gridList.add(propertyFormGrid);                
                  }
                  //Increment the number of properties on the form (
                  //Note that if some property is removed from the form this variable is not decremented)
                  this.propertiesCount++;
                 
              } catch (Exception ex) {
                  logger.error("The following exception occured " +
                            "when trying to create a new property form: " + ex.toString());   
              }
          }   
         
          public void removeNewProperty(ActionEvent event){

       

              //not yet implemented....(got a breakpoint here)
              //

             //   

       

          }

       

       

      Currently I have 2 issues. The first one is is with the "HtmlAjaxCommandButton removeButton = new HtmlAjaxCommandButton();"

      it doesn't invoke the "public void removeNewProperty(ActionEvent event){" on the bean.

      The HtmlAjaxCommandButton declared in the JSP works fine. I create a new Property Form tha has a the "HtmlAjaxCommandButton removeButton" to remove the form.

      Please help me with this.

       

      The second issue is with the ListShuttle. Whe I add the first newPropertyForm it doesn't work. but with the second form the both start to work. Why this is happening?

       

      best regards