1

嗨,我想实现一个带有水平和垂直滚动条的可编辑表,所以我选择了富面的扩展表,并想编辑这个表中的数据,所以我选择了就地输入和就地选择,如果我工作得很好少于 30 行,如果我有更多的行说 600 行.....渲染页面太慢了

没有就地选择,我只是尝试显示它工作得很好,所以我认为原因如下,因为每行有 6 个就地选择,所以它太慢了,因为它需要加载 600*6 =3600 选择下拉并且对于每个下拉菜单,它将进入模态类以获取每个下拉菜单的选择列表。

在这 600 行的每一行中重复这 6 个下拉菜单......那么有什么方法可以提高性能并使用这个解决方案,或者有什么好的解决方案吗?

有没有办法将下拉选项存储在富面孔客户端的一个变量中并在同一页面上重新使用?

   <!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:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:t="http://myfaces.apache.org/tomahawk"
    xmlns:rich="http://richfaces.org/rich"
     xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:a4j="http://richfaces.org/a4j"

    >

<ui:composition template="/WEB-INF/layout/baseLayoutJs.xhtml">

<rich:messages layout="list" showDetail="true" showSummary="true"
        style="color:darkred">
        <f:facet name="errorMarker">
            <h:graphicImage value="/images/error.gif" />
        </f:facet>
        <f:facet name="infoMarker">
            <h:graphicImage value="/images/passed.gif" />
        </f:facet>
    </rich:messages>
    <ui:define name="content">
                <h:form>
                    <rich:panel style="width:800px">
                <f:facet name="header">
                    <h:panelGrid id="grid0" columns="4" style="width:800px;">
                        <h:outputLabel for="s1212" styleClass="formLabelswidth25"
                            value="Scheme Editor Home" />

                    </h:panelGrid>
                </f:facet>
                <rich:messages layout="list" rendered="true" showDetail="true"
                    showSummary="true" passedLabel="Trying to Save." style="color:red">
                    <f:facet name="errorMarker">
                        <h:graphicImage value="/images/error.gif" />
                    </f:facet>
                    <f:facet name="passedMarker">
                        <h:graphicImage value="/images/passed.gif" />
                    </f:facet>
                </rich:messages>

                <h:panelGrid columns="8" bgcolor="#BED6F8" style="height:30px;" width="780">
                    <h:commandButton action="#{schemeWebEditorHomeHandler.saveScheme}" value="Save" style="height:20px;width:60px;"/>
                        <h:commandButton action="#{schemeWebEditorHomeHandler.addNewSchemeRow}" value="New Row" style="height:20px;width:10x;"/>
                <h:commandButton action="#" value="Clear Row" style="height:20px;width:100px;"/>
                                    <h:commandButton action="#" value="Delete Row" style="height:20px;width:100px;"/>
                    <h:commandButton action="#" value="Update Trays" style="height:20px;width:100px;"/>
                        <h:commandButton action="#" value="Search" style="height:20px;width:100px;"/>
                            <h:commandButton action="#" value="Copy" style="height:20px;width:100px;"/>
                            <h:commandButton action="#" value="Help" style="height:20px;width:100px;"/>
                </h:panelGrid>
                    <t:div style=" height : 10px;"></t:div>
                <h:panelGrid id="searchData" style="width=780px;">


                    <rich:extendedDataTable id="data" var="list"
                    preserveDataModel="false"   preserveSort="true"  bgcolor="#BED6F8"  style="height:300px; width:780px;"
                    frozenColumns="3" 
                    selection="#{schemeWebEditorHomeHandler.selection}" selectionMode="multiple"
                    value="#{schemeWebEditorHomeHandler.sortSchemeRowList}" width="780"   rowKeyVar="row">

                  <rich:column align="left" width="130px" >
                    <f:facet name="header">
                      <h:panelGroup width="130px" layout="block">

                         <script type="text/javascript">
                        //<![CDATA[
                            function checkAllCheckboxesInTable( inputId, state ){

                              var commonIdPart = inputId.substr(0, inputId.lastIndexOf(':'));

                              var tableId = commonIdPart ;

                              var tableElement = document.getElementById( tableId );

                              var inputs = tableElement.getElementsByTagName('input');

                              for (var i = 0; i <= inputs.length; i++){
                                  var input = inputs[i];
                                  if( input.getAttribute('type') == 'checkbox' && state){
                                    input.setAttribute('checked', state);
                                  }else{
                                    input.removeAttribute('checked');
                                  }
                              }
                            }
                            //]]>
                          </script>
                        <h:selectBooleanCheckbox id="checkAll" title="#{bundle.CHECK_ALL}" onclick="checkAllCheckboxesInTable( this.id, this.checked );">
                          <a4j:ajax event="change" reRender="data"/>
                        </h:selectBooleanCheckbox>
                        <h:outputText  value=" SELECT ALL"  styleClass="formLabelswidth29"   />

                      </h:panelGroup>
                    </f:facet>
                    <h:selectBooleanCheckbox align="left" id="checkEntry" value="#{list.selected}" disabled="false"/>
                  </rich:column>





                <rich:column>
                <f:facet name="header">
                        <h:outputText value="Start Bin"  styleClass="formLabelswidth29" />
                    </f:facet>
                    <rich:inplaceInput layout="block" value="#{list.startBin}"
                        converterMessage="Start Bin value should be integer. Start Bin at row #{row+1} can't be changed."
                        id="inplace" required="true"
                        requiredMessage="Start Bin at row #{row+1} wasn't filled. Value can't be changed."
                        changedHoverClass="hover" viewHoverClass="hover"
                        viewClass="inplace" changedClass="inplace" style="border-style:none;"
                        selectOnEdit="true" >



                    </rich:inplaceInput>
                    </rich:column>

                        <rich:column>
                <f:facet name="header">
                        <h:outputText value="End Bin" styleClass="formLabelswidth29"/>
                    </f:facet>
                    <rich:inplaceInput layout="block" value="#{list.endBin}"
                        converterMessage="End Bin value should be integer. End Bin  at row #{row+1} can't be changed."
                        id="inplace2" required="true"
                        requiredMessage=" End Bin at row #{row+1} wasn't filled. Value can't be changed."
                        changedHoverClass="hover" viewHoverClass="hover"
                        viewClass="inplace" changedClass="inplace" style="border-style:none;"
                        selectOnEdit="true" >



                    </rich:inplaceInput>
                    </rich:column>


                <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Bin Switch" styleClass="formLabelswidth29"/>
                     </f:facet>

                     <rich:inplaceSelect   value="#{list.binSwitch}"   style="border-style:none;" selectItemClass="SelectItem" >
                       <f:selectItems value="#{schemeWebEditorHomeHandler.binSwitchTypeList}" />
                    </rich:inplaceSelect>

                </rich:column>


               <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Bin Type" styleClass="formLabelswidth29" />
                     </f:facet>

                     <rich:inplaceSelect   value="#{list.binTypeId}"   style="border-style:none;" selectItemClass="SelectItem" >
                       <f:selectItems value="#{schemeWebEditorHomeHandler.binTypeList}" />
                    </rich:inplaceSelect>

                </rich:column>    


               <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Qual Level" styleClass="formLabelswidth29" />
                     </f:facet>

                     <rich:inplaceSelect   value="#{list.quailificationLevelId}"   style="border-style:none;" selectItemClass="SelectItem" >
                       <f:selectItems value="#{schemeWebEditorHomeHandler.sortLevelTypeList}" />
                    </rich:inplaceSelect>

                </rich:column>    



               <rich:column>
                    <f:facet name="header">
                        <h:outputText value="Auto/Mach" styleClass="formLabelswidth29" />
                     </f:facet>

                     <rich:inplaceSelect   value="#{list.autoMachinableId}"   style="border-style:none;" selectItemClass="SelectItem" >
                       <f:selectItems value="#{schemeWebEditorHomeHandler.autoMachTypeList}" />
                    </rich:inplaceSelect>

                </rich:column>                      




                        <rich:column>
                <f:facet name="header">
                        <h:outputText value="Zip Range" styleClass="formLabelswidth29" />
                    </f:facet>
                    <rich:inplaceInput  value="#{list.rangeValue}"
                        converterMessage="Zip Range value should be integer. Zip Range at row #{row+1} can't be changed."
                        id="inplace3" required="false"
                        requiredMessage="Zip Range at row #{row+1} wasn't filled. Value can't be changed."

                        selectOnEdit="true" style="p {display:block};border-style:none;"  >



                    </rich:inplaceInput>
                    </rich:column>


                        <rich:column>
                <f:facet name="header">
                        <h:outputText value="Bin Line 1" styleClass="formLabelswidth29" />
                    </f:facet>
                    <rich:inplaceInput layout="block" value="#{list.binLine1}"
                        converterMessage="Bin Line 1 value should be integer. Bin Line 1 at row #{row+1} can't be changed."
                        id="inplace4" 
                        requiredMessage="Bin Line 1 at row #{row+1} wasn't filled. Value can't be changed."
                        changedHoverClass="hover" viewHoverClass="hover"
                        viewClass="inplace" changedClass="inplace" style="border-style:none;"
                        selectOnEdit="true" minInputWidth="180px" >
                        <f:validateLength minimum="0" maximum="5" />


                    </rich:inplaceInput>

                    </rich:column>

                                            <rich:column>
                <f:facet name="header">
                        <h:outputText value="Bin Line 2" styleClass="formLabelswidth29" />
                    </f:facet>
                    <rich:inplaceInput layout="block" value="#{list.binLine2}"
                        converterMessage="Bin Line 2 value should be integer. Bin Line 2 at row  #{row+1}        can't be changed."
                        id="inplace5"
                        requiredMessage="Bin Line 2 at row #{row+1} wasn't filled. Value can't be changed."
                        changedHoverClass="hover" viewHoverClass="hover"
                        viewClass="inplace" changedClass="inplace" style="border-style:none;"
                        selectOnEdit="true" >



                    </rich:inplaceInput>
                    </rich:column>



                    </rich:extendedDataTable>



            </h:panelGrid>

                </rich:panel>
                    <t:saveState value="#{schemeWebEditorHomeHandler.selectedSchemeId}"></t:saveState>

        <t:saveState value="#{schemeWebEditorHomeHandler.sortSchemeRowList}"></t:saveState>
                    <t:saveState value="#{schemeWebEditorHomeHandler.fromAddNewRow}"></t:saveState>
                </h:form>

    </ui:define>
</ui:composition>
</html>

这是我的豆子

新代码

    @ManagedBean
    @ViewScoped
   public class SchemeWebEditorHomeHandler extends BaseHandler implements
        Serializable {

    private static final long serialVersionUID = -1172151714140365016L;
    private static final Log log = LogFactory.getLog(SchemeWebEditorHomeHandler.class);

    private List<SortSchemeRow> sortSchemeRowList;
    List<SelectItem> binSwitchTypeList;
    boolean fromAddNewRow = false;
    List<SelectItem> binTypeList;
    List<SelectItem> autoMachTypeList;
    List<SelectItem> sortLevelTypeList;
    List<SelectItem> planetCodeTypeList;
    List<SelectItem> subMailTypeList;
    List<SelectItem> trayLabelTypeList;
    List<SelectItem> msMailTypeList;
    List<SelectItem> trayBandingTypeList;
    private Collection<Object> selection;
    private int selectedSchemeId;

    public SchemeWebEditorHomeHandler() throws BaajaException {

        binSwitchTypeList = new ArrayList<SelectItem>();
        binSwitchTypeList.add(new SelectItem(1, "ON"));
        binSwitchTypeList.add(new SelectItem(2, "OF"));

        SchemeExpertService schemeExpert = (SchemeExpertService) ServiceLocator
                .getServiceWithName(SchemeExpertService.class.getName());

        // binTypeList fetch
        if (this.binTypeList == null || this.binTypeList.size() <= 0) {
            Collection machBinTypeList = schemeExpert.getMachBinTypes();
            this.binTypeList = new ArrayList<SelectItem>();
            for (Iterator iterator = machBinTypeList.iterator(); iterator
                    .hasNext();) {
                MachSchemeBinType machSchemeBinType = (MachSchemeBinType) iterator
                        .next();
                this.binTypeList.add(new SelectItem(machSchemeBinType
                        .getSchemeBinTypeId(), machSchemeBinType
                        .getDisplayDescription()));
            }
        }

        if (this.autoMachTypeList == null || this.autoMachTypeList.size() <= 0) {
            Collection dbAutoMAchTypeList = schemeExpert
                    .getAutoMachinableTypes();
            this.autoMachTypeList = new ArrayList<SelectItem>();

            for (Iterator iterator = dbAutoMAchTypeList.iterator(); iterator
                    .hasNext();) {
                CoreAutoMachLite coreAutoMachLite = (CoreAutoMachLite) iterator
                        .next();
                this.autoMachTypeList.add(new SelectItem(coreAutoMachLite
                        .getAutoMachId(), coreAutoMachLite.getDescription()));

            }
        }

        if (this.sortLevelTypeList == null
                || this.sortLevelTypeList.size() <= 0) {
            Collection dbSortLevelTypeList = schemeExpert
                    .getQualificationLevels();
            this.sortLevelTypeList = new ArrayList<SelectItem>();
            for (Iterator iterator = dbSortLevelTypeList.iterator(); iterator
                    .hasNext();) {
                CoreSortLevelLite coreSortLevelLite = (CoreSortLevelLite) iterator
                        .next();

                this.sortLevelTypeList.add(new SelectItem(coreSortLevelLite
                        .getSortLevelId(), coreSortLevelLite.getDescription()));

            }
        }

        planetCodeTypeList = new ArrayList<SelectItem>();
        planetCodeTypeList.add(new SelectItem(true, "ON"));
        planetCodeTypeList.add(new SelectItem(false, "OF"));

        if (this.subMailTypeList == null || this.subMailTypeList.size() <= 0) {
            Collection dbSubMailTypeList = schemeExpert.getSubMailingTypes();
            this.subMailTypeList = new ArrayList<SelectItem>();
            for (Iterator iterator = dbSubMailTypeList.iterator(); iterator
                    .hasNext();) {
                MachSubmailTypeLite machSubmailTypeLite = (MachSubmailTypeLite) iterator
                        .next();

                this.subMailTypeList.add(new SelectItem(machSubmailTypeLite
                        .getSubmailTypeId(), machSubmailTypeLite
                        .getDescription()));

            }
        }

        if (this.msMailTypeList == null || this.msMailTypeList.size() <= 0) {
            Collection dbmsMailTypeList = schemeExpert.getMsMailingTypes();
            this.msMailTypeList = new ArrayList<SelectItem>();
            for (Iterator iterator = dbmsMailTypeList.iterator(); iterator
                    .hasNext();) {
                MsMailTypeLite msMailTypeLite = (MsMailTypeLite) iterator
                        .next();

                this.msMailTypeList.add(new SelectItem(msMailTypeLite
                        .getMsMailTypeId(), msMailTypeLite.getDescription()));

            }
        }

        trayBandingTypeList = new ArrayList<SelectItem>();
        trayBandingTypeList.add(new SelectItem(true, "ON"));
        trayBandingTypeList.add(new SelectItem(false, "OF"));

        if (this.trayLabelTypeList == null
                || this.trayLabelTypeList.size() <= 0) {
            Collection dbtrayLabelTypeList = schemeExpert
                    .getTraySubMailingTypes();
            this.trayLabelTypeList = new ArrayList<SelectItem>();
            for (Iterator iterator = dbtrayLabelTypeList.iterator(); iterator
                    .hasNext();) {
                LogTrayTagTypeLite logTrayTagTypeLite = (LogTrayTagTypeLite) iterator
                        .next();

                this.trayLabelTypeList.add(new SelectItem(logTrayTagTypeLite
                        .getTrayTagTypeId(), logTrayTagTypeLite
                        .getDescription()));

            }
        }


        log.info("Constrctor ...........");

    }


    public String viewScheme() throws BaajaException {
        SchemeExpertService schemeExpert = (SchemeExpertService) ServiceLocator
                .getServiceWithName(SchemeExpertService.class.getName());
        HttpServletRequest req = getServletRequest();
        int sorterSchemeId = this.selectedSchemeId;
        if (req.getParameter("sorterSchemeId") != null
                && req.getParameter("sorterSchemeId").trim().length() > 0) {
            sorterSchemeId = Integer.parseInt(req
                    .getParameter("sorterSchemeId"));

        }
        log.info("Parameter scheme Id :" + sorterSchemeId);
        MachSorterSchemeLite sortScheme = schemeExpert
                .getScheme(sorterSchemeId);
        this.sortSchemeRowList = (List) SortSchemeUtility
                .getSortSchemeRow(sortScheme.getMachSortSchemeGroups());
        if (sortSchemeRowList.size() > 0) {

        } else {
            addErrorMessage("No matching records found for selected criteria");
        }
        return "view_SchemeWebHome_Screen";
    }

    public String saveScheme() throws BaajaException {
        System.out.println("Hello inside save scheme");
        // log.info("listSize5"+this.sortSchemeRowList.size());
        // sortSchemeRowList= getSortSchemeRowList();

        SchemeExpertService schemeExpert = (SchemeExpertService) ServiceLocator
                .getServiceWithName(SchemeExpertService.class.getName());

        MachSorterSchemeLite sortScheme = schemeExpert
                .getScheme(this.selectedSchemeId);

        schemeExpert.updateSchemeWithSorterSchemeGroup(sortScheme,
                SortSchemeUtility.getSortSchemeGroups(
                        (Collection) this.sortSchemeRowList, sortScheme));

        return viewScheme();
    }

    public String addNewSchemeRow() throws BaajaException {
        log.info("listSize" + this.sortSchemeRowList.size());
        SortSchemeRow sr = new SortSchemeRow();
        sr.setSubMailingTypeId(1);
        sr.setGroupSeparator("");
        sr.setBinSwitch(1);
        sr.setAutoMachinableId(1);
        sr.setBinTypeId(1);
        sr.setQuailificationLevelId(1);

        this.sortSchemeRowList.add(sr);
        // log.info(getSortSchemeRowList().size()+"listSize2"+this.sortSchemeRowList.size());
        setFromAddNewRow(true);
        return "view_SchemeWebHome_Screen";
    }

    public List<SortSchemeRow> getSortSchemeRowList() throws BaajaException {
        SchemeExpertService schemeExpert = (SchemeExpertService) ServiceLocator
        .getServiceWithName(SchemeExpertService.class.getName());

        if (this.sortSchemeRowList == null || sortSchemeRowList.size() <= 0) {
            if (!this.fromAddNewRow) {
                HttpServletRequest req = getServletRequest();
                if (req.getParameter("sorterSchemeId") != null) {
                    this.selectedSchemeId = Integer.parseInt(req
                            .getParameter("sorterSchemeId"));
                }
                log.info("Parameter scheme Id :" + this.selectedSchemeId);
                MachSorterSchemeLite sortScheme = schemeExpert
                        .getScheme(this.selectedSchemeId);
                sortSchemeRowList = (List) SortSchemeUtility
                        .getSortSchemeRow(sortScheme.getMachSortSchemeGroups());
            }
        }
        if (sortSchemeRowList.size() > 0) {
            return sortSchemeRowList;
        } else {
            addErrorMessage("No matching records found for selected criteria");
        }
        return sortSchemeRowList;
    }

    public void setSortSchemeRowList(List<SortSchemeRow> sortSchemeRowList) {
        this.sortSchemeRowList = sortSchemeRowList;
    }

    public List<SelectItem> getBinSwitchTypeList() {
        return binSwitchTypeList;
    }
    public boolean isFromAddNewRow() {
        return fromAddNewRow;
    }
    public void setFromAddNewRow(boolean fromAddNewRow) {
        this.fromAddNewRow = fromAddNewRow;
    }
    public List<SelectItem> getBinTypeList() throws BaajaException {
        return binTypeList;
    }
    public List<SelectItem> getAutoMachTypeList() throws BaajaException {
        log.info("autoMachTypeList ...........");
        return autoMachTypeList;
    }
    public List<SelectItem> getSortLevelTypeList() throws BaajaException {
        return sortLevelTypeList;
    }
    public List<SelectItem> getPlanetCodeTypeList() {
        return planetCodeTypeList;
    }
    public List<SelectItem> getSubMailTypeList() throws BaajaException {
        return subMailTypeList;
    }
    public List<SelectItem> getTrayLabelTypeList() throws BaajaException {
        return trayLabelTypeList;
    }
    public List<SelectItem> getMsMailTypeList() throws BaajaException {
        return msMailTypeList;
    }
    public List<SelectItem> getTrayBandingTypeList() {
        return trayBandingTypeList;
    }
    public Collection<Object> getSelection() {
        return selection;
    }
    public void setSelection(Collection<Object> selection) {
        this.selection = selection;
    }
    public int getSelectedSchemeId() {
        return selectedSchemeId;
    }
    public void setSelectedSchemeId(int selectedSchemeId) {
        this.selectedSchemeId = selectedSchemeId;
    }

}
4

0 回答 0