popupPanel not show in rich:dataTable

StackOverflow https://stackoverflow.com/questions/14623813

Question

Base on the sample from:

http://showcase.richfaces.org/richfaces/component-sample.jsf?demo=dataTable&sample=dataTableEdit&skin=blueSky

I did a bit modify on the xhtml page and CarBean to include a button to display the result. Result display as expected but the popup panel not working (ie. no popup).

Software version I use:

richface 4.3.0 Final GAE 1.7.2

Note: It work fine on my local notebook and problem mention above apply when deploy online.

Here the online url http://cloudenterpriseapps.appspot.com/public/test/testPopup5.jsf

Any help?

[CarsBean.java] package test.faces.bean;

import java.io.Serializable;
import java.math.BigDecimal;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Collections;
import java.util.Comparator;
import java.util.Iterator;
import java.util.List;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.bean.ViewScoped;
import javax.faces.event.ValueChangeEvent;
import javax.faces.model.SelectItem;

import org.richfaces.demo.common.data.RandomHelper;
import org.richfaces.demo.tables.model.cars.InventoryItem;
import org.richfaces.demo.tables.model.cars.InventoryVendorItem;
import org.richfaces.demo.tables.model.cars.InventoryVendorList;

@ManagedBean(name = "carsBean2")
@SessionScoped
public class CarsBean2 implements Serializable {
   /**
    *
    */
   private static final long serialVersionUID = -3832235132261771583L;
   private static final int DECIMALS = 1;
   private static final int CLIENT_ROWS_IN_AJAX_MODE = 15;
   private static final int ROUNDING_MODE = BigDecimal.ROUND_HALF_UP;
   private List<InventoryItem> allInventoryItems = null;
   private List<InventoryVendorList> inventoryVendorLists = null;
   private int currentCarIndex;
   private InventoryItem editedCar;
   private int page = 1;

   private int clientRows;

   public void switchAjaxLoading(ValueChangeEvent event) {
       this.clientRows = (Boolean) event.getNewValue() ? CLIENT_ROWS_IN_AJAX_MODE : 0;
   }

   public void remove() {
       allInventoryItems.remove(allInventoryItems.get(currentCarIndex));
   }

   public void store() {      
       allInventoryItems.set(currentCarIndex, editedCar);
   }

   public List<SelectItem> getVendorOptions() {
       List<SelectItem> result = new ArrayList<SelectItem>();
       result.add(new SelectItem("", ""));
       for (InventoryVendorList vendorList : getInventoryVendorLists()) {
           result.add(new SelectItem(vendorList.getVendor()));
       }
       return result;
   }

   public List<String> getAllVendors() {
       List<String> result = new ArrayList<String>();
       for (InventoryVendorList vendorList : getInventoryVendorLists()) {
           result.add(vendorList.getVendor());
       }
       return result;
   }

   public List<InventoryVendorList> getInventoryVendorLists() {
       synchronized (this) {
           if (inventoryVendorLists == null) {
               inventoryVendorLists = new ArrayList<InventoryVendorList>();
               List<InventoryItem> inventoryItems = getAllInventoryItems();

               Collections.sort(inventoryItems, new Comparator<InventoryItem>() {
                   public int compare(InventoryItem o1, InventoryItem o2) {
                       return o1.getVendor().compareTo(o2.getVendor());
                   }
               });
               Iterator<InventoryItem> iterator = inventoryItems.iterator();
               InventoryVendorList vendorList = new InventoryVendorList();
               vendorList.setVendor(inventoryItems.get(0).getVendor());
               while (iterator.hasNext()) {
                   InventoryItem item = iterator.next();
                   InventoryVendorItem newItem = new InventoryVendorItem();
                   itemToVendorItem(item, newItem);
                   if (!item.getVendor().equals(vendorList.getVendor())) {
                       inventoryVendorLists.add(vendorList);
                       vendorList = new InventoryVendorList();
                       vendorList.setVendor(item.getVendor());
                   }
                   vendorList.getVendorItems().add(newItem);
               }
               inventoryVendorLists.add(vendorList);
           }
       }
       return inventoryVendorLists;
   }

   private void itemToVendorItem(InventoryItem item, InventoryVendorItem newItem) {
       newItem.setActivity(item.getActivity());
       newItem.setChangePrice(item.getChangePrice());
       newItem.setChangeSearches(item.getChangeSearches());
       newItem.setDaysLive(item.getDaysLive());
       newItem.setExposure(item.getExposure());
       newItem.setInquiries(item.getInquiries());
       newItem.setMileage(item.getMileage());
       newItem.setMileageMarket(item.getMileageMarket());
       newItem.setModel(item.getModel());
       newItem.setPrice(item.getPrice());
       newItem.setPriceMarket(item.getPriceMarket());
       newItem.setPrinted(item.getPrinted());
       newItem.setStock(item.getStock());
       newItem.setVin(item.getVin());
   }

   public String queryRec(){
       String result = "";
       synchronized (this) {
           getAllInventoryItems();
       }
       return result;
   }

   public String initQuery(){
       String result = "";
       synchronized (this) {
           allInventoryItems = null;
       }
       return result;
   }
   public List<InventoryItem> getInventoryItems() {
       return allInventoryItems;
   }

   public List<InventoryItem> getAllInventoryItems() {
       synchronized (this) {
           if (allInventoryItems == null) {
               allInventoryItems = new ArrayList<InventoryItem>();

               for (int k = 0; k <= 5; k++) {
                   try {
                       switch (k) {
                           case 0:
                               allInventoryItems.addAll(createCar("Chevrolet", "Corvette", 5));
                               allInventoryItems.addAll(createCar("Chevrolet", "Malibu", 8));
                               allInventoryItems.addAll(createCar("Chevrolet", "Tahoe", 6));

                               break;

                           case 1:
                               allInventoryItems.addAll(createCar("Ford", "Taurus", 12));
                               allInventoryItems.addAll(createCar("Ford", "Explorer", 11));

                               break;

                           case 2:
                               allInventoryItems.addAll(createCar("Nissan", "Maxima", 9));
                               allInventoryItems.addAll(createCar("Nissan", "Frontier", 6));

                               break;

                           case 3:
                               allInventoryItems.addAll(createCar("Toyota", "4-Runner", 7));
                               allInventoryItems.addAll(createCar("Toyota", "Camry", 15));
                               allInventoryItems.addAll(createCar("Toyota", "Avalon", 13));

                               break;

                           case 4:
                               allInventoryItems.addAll(createCar("GMC", "Sierra", 8));
                               allInventoryItems.addAll(createCar("GMC", "Yukon", 10));

                               break;

                           case 5:
                               allInventoryItems.addAll(createCar("Infiniti", "G35", 6));
                               allInventoryItems.addAll(createCar("Infiniti", "EX35", 5));

                               break;

                           default:
                               break;
                       }
                   } catch (Exception e) {
                       e.printStackTrace();
                   }
               }
           }
       }
       return allInventoryItems;
   }

   public List<InventoryItem> createCar(String vendor, String model, int count) {
       ArrayList<InventoryItem> iiList = null;

       try {
           int arrayCount = count;
           InventoryItem[] demoInventoryItemArrays = new InventoryItem[arrayCount];

           for (int j = 0; j < demoInventoryItemArrays.length; j++) {
               InventoryItem ii = new InventoryItem();

               ii.setVendor(vendor);
               ii.setModel(model);
               ii.setStock(RandomHelper.randomstring(6, 7));
               ii.setVin(RandomHelper.randomstring(17, 17));
               ii.setMileage(new BigDecimal(RandomHelper.rand(5000, 80000)).setScale(DECIMALS, ROUNDING_MODE));
               ii.setMileageMarket(new BigDecimal(RandomHelper.rand(25000, 45000)).setScale(DECIMALS, ROUNDING_MODE));
               ii.setPrice(new Integer(RandomHelper.rand(15000, 55000)));
               ii.setPriceMarket(new BigDecimal(RandomHelper.rand(15000, 55000)).setScale(DECIMALS, ROUNDING_MODE));
               ii.setDaysLive(RandomHelper.rand(1, 90));
               ii.setChangeSearches(new BigDecimal(RandomHelper.rand(0, 5)).setScale(DECIMALS, ROUNDING_MODE));
               ii.setChangePrice(new BigDecimal(RandomHelper.rand(0, 5)).setScale(DECIMALS, ROUNDING_MODE));
               ii.setExposure(new BigDecimal(RandomHelper.rand(0, 5)).setScale(DECIMALS, ROUNDING_MODE));
               ii.setActivity(new BigDecimal(RandomHelper.rand(0, 5)).setScale(DECIMALS, ROUNDING_MODE));
               ii.setPrinted(new BigDecimal(RandomHelper.rand(0, 5)).setScale(DECIMALS, ROUNDING_MODE));
               ii.setInquiries(new BigDecimal(RandomHelper.rand(0, 5)).setScale(DECIMALS, ROUNDING_MODE));
               demoInventoryItemArrays[j] = ii;
           }

           iiList = new ArrayList<InventoryItem>(Arrays.asList(demoInventoryItemArrays));
       } catch (Exception e) {
           e.printStackTrace();
       }

       return iiList;
   }

   public int getCurrentCarIndex() {
       return currentCarIndex;
   }

   public void setCurrentCarIndex(int currentCarIndex) {
       this.currentCarIndex = currentCarIndex;
   }

   public InventoryItem getEditedCar() {
       return editedCar;
   }

   public void setEditedCar(InventoryItem editedCar) {
       this.editedCar = editedCar;
   }

   public int getPage() {
       return page;
   }

   public void setPage(int page) {
       this.page = page;
   }

   public int getClientRows() {
       return clientRows;
   }

   public void setClientRows(int clientRows) {
       this.clientRows = clientRows;
   }
}

[testPopup5.xhtml]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:rich="http://richfaces.org/rich"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:c="http://java.sun.com/jsp/jstl/core">

<ui:composition>
    <h:head>
        <title>RichFaces Showcase</title>
    </h:head>
    <h:body>
        <h:outputStylesheet>
        a.no-decor>img {
        border: none;
        }
    </h:outputStylesheet>
        <a4j:status onstart="#{rich:component('statPane')}.show()"
            onstop="#{rich:component('statPane')}.hide()" />

        <h:form>
            <h:panelGrid columns="2">
                <a4j:commandButton id="search" action="#{carsBean2.queryRec}"
                    value="Search" render="table" />
                <a4j:commandButton id="reset" action="#{carsBean2.initQuery}"
                    value="Reset" type="reset" render="table" />
            </h:panelGrid>
        </h:form>

        <h:form>
            <rich:dataTable value="#{carsBean2.inventoryItems}" var="car"
                id="table" rows="5">
                <rich:column>
                    <f:facet name="header">Model</f:facet>
                    <h:outputText value="#{car.model}" />
                </rich:column>
                <rich:column>
                    <f:facet name="header">Price</f:facet>
                    <h:outputText value="#{car.price}" />
                </rich:column>
                <rich:column>
                    <a4j:commandLink styleClass="no-decor" render="editGrid" 
                        execute="@this" oncomplete="#{rich:component('editPanel')}.show()">
                        <h:graphicImage value="/images/icons/common/edit.gif" alt="edit" />
                        <f:setPropertyActionListener target="#{carsBean2.editedCar}"
                            value="#{car}" />
                    </a4j:commandLink>
                </rich:column>
            </rich:dataTable>

            <rich:popupPanel id="statPane" autosized="true" rendered="true">
                <h:graphicImage value="/images/common/ai.gif" alt="ai" />
                Please wait...
            </rich:popupPanel>

            <rich:popupPanel header="Edit Car Details" id="editPanel">
                <h:panelGrid columns="3" id="editGrid">
                    <h:outputText value="Model" />
                    <h:outputText value="#{carsBean2.editedCar.model}" />
                    <h:panelGroup />
                    <h:outputText value="Price" />
                    <h:outputText value="#{carsBean2.editedCar.price}" />
                    <h:panelGroup />
                </h:panelGrid>
                <a4j:commandButton value="Cancel"
                    onclick="#{rich:component('editPanel')}.hide(); return false;" />                    
            </rich:popupPanel>
        </h:form>

    </h:body>
</ui:composition>
</html>

Using firebug, I manage discover few diff between local and online GAE version.

1) editPanel @ local change it style stage from 'visibility hidden' to 'display none' and then 'display block' when click on edit icon.
However editPanel @ GAE still remain unchange with 'visibility hidden'

[Local]

<div id="j_idt9:editPanel" style="visibility: hidden;">
<div id="j_idt9:editPanel" style="display: none;">
<div id="j_idt9:editPanel" style="display: block;">

[GAE]

<div id="j_idt9:editPanel" style="visibility: hidden;">

2) under , local version contain value in table tag

3) Shown in firebug's script tab, when click on edit link, local version display as: and follow by table values. However online version display it as and without any table values

p/s: Online: http://cloudenterpriseapps.appspot.com/public/test/testPopup5.jsf

By the way the GAE display below warning when page first load. Don't know is related to the problem or not. [s~cloudenterpriseapps/0.365021621033424561].: SystemId Unknown; Line #57; Column #31; Failed calling setMethod method

[FireBug Script tab, Local. Click on edit link]

<?xml version='1.0' encoding='UTF-8'?>
<partial-response><changes><update id="j_idt9:editGrid"><![CDATA[<table id="j_idt9:editGrid">
<tbody>
<tr>
<td>Model</td>
<td>Corvette</td>
<td></td>
</tr>
<tr>
<td>Price</td>
<td>47405</td>
<td></td>
</tr>
</tbody>
</table>
]]></update><update id="javax.faces.ViewState"><![CDATA[H4sIAAAAAAEUTEh...EUXAkFAAA]]></update></changes><extension id="org.richfaces.extension"><complete>RichFaces.$('j_idt9:editPanel').show();</complete><render>j_idt9:editGrid</render></extension></partial-response>

[FireBug Script tab, GAE. Click on edit link]

<?xml version='1.0' encoding='UTF-8'?>
<partial-response><changes><update id="javax.faces.ViewState"><![CDATA[H4sIAAAAAAAAANVYbW....KBTUkFAAA]]></update></changes></partial-response>
Was it helpful?

Solution

Solved after upgrade JSF api and implementation jar from 2.0 to 2.1

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top