组件中的动作侦听器不起作用

时间:2017-10-17 16:16:04

标签: primefaces jsf-2.2

  • JVM 1.8.0_144
  • JSF 2.2.14(Mojarra)
  • PrimeFaces 6.1.4

根本原因是组件中的 p:dialog 未正确附加到HTML正文。

据我所知,这个示例应该将包含 uspsRecommendedAddressDlg ID的表单附加到文档末尾的组件中,但它仍保留在外部表单中。在完全充实的版本中,这可以防止 commandButton 中的 actionListener 被执行。

主要的JSF页面。

angular.module('adminApp')
.service('subCategoryFinder', ['$http',function($http){
        var self = this;
        self.getSubCategory = function(){
            var data = {};
             $http.get('/app/admin/category/category.json').then(function (response) {
                 data = response.data;
                 console.log(data);
              });
             return data;
        }
}]);

组件

<!DOCTYPE html>
<html lang="en" 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:p="http://primefaces.org/ui"
    xmlns:my_cc="http://xmlns.jcp.org/jsf/composite/components"
    >
    <h:head>
    </h:head>
    <h:body>

        <p class="center">Test Address Validation</p>

        <p:panel>
            <h:form id="addressForm" name="addressForm" prependId="false">
                <my_cc:bareBones />
            </h:form>
        </p:panel>
    </h:body>
</html>

生成的HTML

<?xml version="1.0" encoding="UTF-8"?>
<ui:component
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:cc="http://xmlns.jcp.org/jsf/composite"
    xmlns:p="http://primefaces.org/ui"
>

    <cc:interface name="bareBones" displayName="bareBones" shortDescription="Address Collector">
    </cc:interface>

    <cc:implementation>
        <h1>Content</h1>
        <p:dialog
            id="uspsRecommendedAddressDlg"
            widgetVar="uspsRecommendedAddressDlg"
            modal="true"
            appendTo="@(body)"            
            header="Header"
            position="300, 100"
            closable="false"
        >

            <h:form id="selectAddressDlgForm" prependId="false">
                <p:outputPanel id="selectAddressPanel">

                    <div class="singleRow">
                        <h2>Title</h2>
                    </div>

                </p:outputPanel>
            </h:form>
        </p:dialog>
    </cc:implementation>
</ui:component>

1 个答案:

答案 0 :(得分:0)

感谢@Kukeltje的支持!

最终答案是构建组件,使其没有嵌入的表单。让表单来自周围的JSF文档。