代码之家  ›  专栏  ›  技术社区  ›  jMarcel

如何在加载表单后触发Ajax来加载嵌套下拉列表?

  •  0
  • jMarcel  · 技术社区  · 6 年前

    我有一个按钮显示一个编辑对话框窗体,其中有一个selectonemenu,其中包含前缀值,在选择了其中一个前缀值后,三个selectcheckboxmenu将加载员工数据。这工作很好。

    <p:outputLabel value="prefix" for="prefixo" />
    <h:panelGroup>
        <p:selectOneMenu id="prefixo" value="#{demandasController.selected.prefixo}" converter="prefixosConverter" filter="true" filterMatchMode="contains">
            <f:selectItem itemLabel="#{adeBundle.SelectOneMessage}" itemValue="#{null}" />
            <f:selectItems value="#{prefixosController.items}"
                           var="prefixoItem"
                           itemValue="#{prefixoItem}"
                           itemLabel="#{prefixoItem.prefixo} - #{prefixoItem.nomePrefixo}"
                           />
            <p:ajax event="valueChange" update="uorPosCollection uorPosCollection1 uorPosCollection2" listener="#{demandasController.changePrefixo}"/>
        </p:selectOneMenu>
    </h:panelGroup>
    
    <p:outputLabel value="Executivo(s)" for="uorPosCollection" />
    <p:selectCheckboxMenu id="uorPosCollection" value="#{demandasController.selected.uorPosCollection}" label="Executivo(s)" multiple="true" converter="uorPosConverter" filter="true" filterMatchMode="contains" >
        <f:selectItems value="#{demandasController.availableExecutivos}"
                       var="uorPosCollectionItem"
                       itemValue="#{uorPosCollectionItem}"
                       itemLabel="#{uorPosCollectionItem.matricula} - #{uorPosCollectionItem.nome} (#{uorPosCollectionItem.prefixo.prefixo})" />
    </p:selectCheckboxMenu>
    <!-- analogous code ommited -->
    

    听众:

    public void changePrefixo(AjaxBehaviorEvent event) {
        availableExecutivos = LoadExecutivosListCombo(super.getSelected().getPrefixo());
        //analogous methods ommited
    }
    

    加载员工列表的方法:

    private List<UorPos> LoadExecutivosListCombo(Prefixos prefixos) {
        List<SelectItem> listExecutivosCombo = new ArrayList<>();
        List<UorPos> listExecutivos = uorPosFacade.findUorPosExecutivosByPrefixo(prefixos);
        for (int i = 0; i < listExecutivos.size(); i++) {
            listExecutivosCombo.add(new SelectItem(listExecutivos.get(i)));
        }
        return listExecutivos;
    }
    
    //analagous methods ommited
    

    要检索数据库的本机查询:

    public List<UorPos> findUorPosExecutivosByPrefixo(Prefixos prefixo) {
        return (List<UorPos>) getEntityManager().createNativeQuery("SELECT * FROM UorPos WHERE prefixo=9951", UorPos.class).setParameter(1, prefixo.getPrefixo()).getResultList();
    }
    //analagous methods ommited
    

    但是,当编辑一个已经有前缀和雇员值的寄存器(由某些用户提前保存)时,将加载3个SelectCheckboxMenu,在其标签值上显示(不需要的)ID的实体类名。 空下拉列表:

    nested empty dropdowns with pre-selected values displayng (undesired) class name

    例如:在上图中,当加载编辑表单时,它显示一些用户先前保存的值:前缀9882(如预期显示) 员工的三个(空)下拉列表(显示不需要的类名)。如果我选择的值与9882不同,则按预期填充下拉列表(Ajax),如果我再次选择9882,则按预期显示员工(不带类名):

    9882 selected after have selected other value in this dropdown

    我试图通过如下激活Ajax来解决问题,但不知道如何在函数中调用它:

    <p:dialog onShow="CallAjaxFunction()" modal="true" >
    
            <script>
            function CallAjaxFunction() {
            <!-- how to call the ajax here ? -->
                alert("displaying after form was loaded.")        
            }
            </script>
       ...
    </p:dialog>
    

    有人知道如何在加载表单后触发Ajax来加载嵌套下拉列表吗?

    或者,如果有人有任何其他解决方案来显示标签中的值(没有类名),并自动加载嵌套的下拉列表,我很感激。

    事先谢谢。

    1 回复  |  直到 6 年前
        1
  •  0
  •   jMarcel    6 年前

    在研究之后,我已经使用侦听器更新了组合框,为此使用了 打开 对话框中的Ajax事件:

    <p:dialog onShow="PF('prefixowv').selectValue(':selected').click();" update= DemandasEditForm:uorPosCollection DemandasEditForm:uorPosCollection1 DemandasEditForm:uorPosCollection2 />
    

    并将Ajax事件更改为Selectem,而不是ValueChange:

    <p:selectOneMenu id="prefixo" value="#{demandasController.selected.prefixo}" converter="prefixosConverter" filter="true" filterMatchMode="contains">
        <f:selectItem itemLabel="#{adeBundle.SelectOneMessage}" itemValue="#{null}" />
        <f:selectItems value="#{prefixosController.items}"
                       var="prefixoItem"
                       itemValue="#{prefixoItem}"
                       itemLabel="#{prefixoItem.prefixo} - #{prefixoItem.nomePrefixo}"
                       />
        <p:ajax event="selectItem" update="uorPosCollection uorPosCollection1 uorPosCollection2" listener="#{demandasController.changePrefixo}"/>
    </p:selectOneMenu>
    

    当做,