2 Replies Latest reply on Dec 4, 2007 4:26 PM by asookazian

    embedding scrollableDataTable in a modalPanel - help

    asookazian

      In the xhtml below, the scrollableDataTable works and displays properly outside the modalPanel, but when the modalPanel shows, there is an empty scrollableDataTable (outlined by a rectangle) inside it.

      Why and what should I do to fix this???

      <!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <ui:composition xmlns="http://www.w3.org/1999/xhtml"
       xmlns:s="http://jboss.com/products/seam/taglib"
       xmlns:ui="http://java.sun.com/jsf/facelets"
       xmlns:f="http://java.sun.com/jsf/core"
       xmlns:h="http://java.sun.com/jsf/html"
       xmlns:rich="http://richfaces.ajax4jsf.org/rich"
       xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
       xmlns:c="http://java.sun.com/jstl/core"
       template="layout/template.xhtml">
      
      
      
      <ui:define name="body">
      
       <script type="text/javascript">
       function showPanel() {
       Richfaces.showModalPanel('mpNote',{width:450, top:200});
       }
       </script>
      
      
       <rich:modalPanel id="mpNote"> <!-- minHeight="200" minWidth="450" height="500" width="500" zindex="2000"> -->
       <h:form>
      
       <rich:scrollableDataTable value="#{noteAction.getNoteLogList()}" var="myRow" rows="10" height="50px" width="300px">
      
       <rich:column>
       <f:facet name="header">NoteText</f:facet>
       <h:outputText value="#{myRow.noteText}"/>
       </rich:column>
      
       <rich:column>
       <f:facet name="header">TimeStamp</f:facet>
       <h:outputText value="#{myRow.timeStamp}"/>
       </rich:column>
      
       </rich:scrollableDataTable>
       </h:form>
       </rich:modalPanel>
      
       <h:commandButton value="show" onclick="showPanel();"/>
       <BR/><BR/>
       <h:form>
      
       <rich:scrollableDataTable value="#{noteAction.getNoteLogList()}" var="myRow" rows="10" height="50px" width="300px">
      
       <rich:column>
       <f:facet name="header">NoteText</f:facet>
       <h:outputText value="#{myRow.noteText}"/>
       </rich:column>
      
       <rich:column>
       <f:facet name="header">TimeStamp</f:facet>
       <h:outputText value="#{myRow.timeStamp}"/>
       </rich:column>
      
       </rich:scrollableDataTable>
       </h:form>
      
      </ui:define>
      </ui:composition>


        • 1. Re: embedding scrollableDataTable in a modalPanel - help
          asookazian

          I added a h:dataTable inside the modalPanel and the h:dataTable displays fine...

          <!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
          <ui:composition xmlns="http://www.w3.org/1999/xhtml"
           xmlns:s="http://jboss.com/products/seam/taglib"
           xmlns:ui="http://java.sun.com/jsf/facelets"
           xmlns:f="http://java.sun.com/jsf/core"
           xmlns:h="http://java.sun.com/jsf/html"
           xmlns:rich="http://richfaces.ajax4jsf.org/rich"
           xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
           xmlns:c="http://java.sun.com/jstl/core"
           template="layout/template.xhtml">
          
          
          
          <ui:define name="body">
          
           <script type="text/javascript">
           function showPanel() {
           Richfaces.showModalPanel('mpNote',{width:450, top:200});
           }
           </script>
          
          
           <rich:modalPanel id="mpNote"> <!-- minHeight="200" minWidth="450" height="500" width="500" zindex="2000"> -->
           <h:form>
          
           <rich:scrollableDataTable value="#{noteAction.getNoteLogList()}" var="myRow" rows="10" height="50px" width="300px">
          
           <rich:column>
           <f:facet name="header">NoteText</f:facet>
           <h:outputText value="#{myRow.noteText}"/>
           </rich:column>
          
           <rich:column>
           <f:facet name="header">TimeStamp</f:facet>
           <h:outputText value="#{myRow.timeStamp}"/>
           </rich:column>
          
           </rich:scrollableDataTable>
          
           <rich:dataTable value="#{noteAction.getNoteLogList()}" var="myRow">
          
           <rich:column>
           <f:facet name="header">NoteText</f:facet>
           <h:outputText value="#{myRow.noteText}"/>
           </rich:column>
          
           <rich:column>
           <f:facet name="header">TimeStamp</f:facet>
           <h:outputText value="#{myRow.timeStamp}"/>
           </rich:column>
          
           </rich:dataTable>
           </h:form>
           </rich:modalPanel>
          
           <h:commandButton value="show" onclick="showPanel();"/>
           <BR/><BR/>
           <h:form>
          
           <rich:scrollableDataTable value="#{noteAction.getNoteLogList()}" var="myRow" rows="10" height="50px" width="300px">
          
           <rich:column>
           <f:facet name="header">NoteText</f:facet>
           <h:outputText value="#{myRow.noteText}"/>
           </rich:column>
          
           <rich:column>
           <f:facet name="header">TimeStamp</f:facet>
           <h:outputText value="#{myRow.timeStamp}"/>
           </rich:column>
          
           </rich:scrollableDataTable>
           </h:form>
          
          </ui:define>
          </ui:composition>


          • 2. Re: embedding scrollableDataTable in a modalPanel - help
            asookazian

            sorry I meant added rich:dataTable...