素面 3 : Component ID and Widget Var should not have the same name-6ren

素面 3 : Component ID and Widget Var should not have the same name

转载作者：行者123 更新时间：2023-12-05 01:31:17

我很困惑为什么 IE 和 Chrome 无法呈现我的 Primefaces 3 UI。

我基本上有这个用例:我想要一个添加新成员按钮，当用户单击它时，将打开一个对话框，询问成员详细信息。

<!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:p="http://primefaces.org/ui">
<h:head>

</h:head>
<h:body>
    <ui:composition template="../../WEB-INF/MyTemplate.xhtml">
        <ui:define name="content">
            <h:form id="memberListForm">
                <p:panel styleClass="search-panel">
                    <h:panelGrid columns="2">
                        <h:outputText value="#{msgs.firstName}" styleClass="label" />
                        <h:inputText />
                    </h:panelGrid>
                    <h:panelGrid columns="2">
                        <h:outputText value="#{msgs.lastName}" styleClass="label" />
                        <h:inputText />
                    </h:panelGrid>
                    <p:commandButton value="Search" ajax="false" />
                    <p:commandButton value="Add New Member" type="button"
                        onclick="addMemberDialog.show()" />
                </p:panel>

                <p:panel>
                    <p:dataTable value="#{memberManagedBean.memberDataModel}"
                        id="membersTable" var="member" paginator="true" rows="10"
                        selectionMode="single"
                        paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                        rowsPerPageTemplate="5,10,15">
                        <p:column>
                            <f:facet name="header">
                                <h:outputText>#{msgs.firstName}</h:outputText>
                            </f:facet>
                            <h:outputText value="#{member.firstName}" />
                        </p:column>
                        <p:column>
                            <f:facet name="header">
                                <h:outputText>Middle Name</h:outputText>
                            </f:facet>
                            <h:outputText value="#{member.middleName}" />
                        </p:column>
                        <p:column>
                            <f:facet name="header">
                                <h:outputText>Last Name</h:outputText>
                            </f:facet>
                            <h:outputText value="#{member.lastName}" />
                        </p:column>
                        <p:column>
                            <f:facet name="header">
                                <h:outputText>Membership Date</h:outputText>
                            </f:facet>
                            <h:outputText value="#{member.membershipDate}">
                                <f:convertDateTime pattern="MMM dd, yyyy" />
                            </h:outputText>
                        </p:column>
                        <p:column>
                            <f:facet name="header">
                                <h:outputText>Status</h:outputText>
                            </f:facet>
                            <h:outputText value="#{member.status}" />
                        </p:column>
                    </p:dataTable>
                </p:panel>
            </h:form>

            <p:dialog id="addMemberDialog" header="Member Details"
                widgetVar="addMemberDialog" resizable="false" closable="false">
                <h:form id="createupdateform">
                    <p:messages id="messages" autoUpdate="true" />
                    <h:outputText value="Test Dialog!" />
                    <p:panelGrid columns="2" id="panel">
                        <f:facet name="header">
                            Create Member
                        </f:facet>
                        <h:outputLabel value="First Name:" for="firstName" />
                        <p:inputText label="First Name" id="firstName" title="First Name"
                            required="true" value="#{memberManagedBean.newMember.firstName}">
                            <f:validateRegex pattern=".*\p{Alpha}{3,16}" />
                        </p:inputText>
                        <h:outputLabel value="Middle Name:" for="middleName" />
                        <p:inputText label="Middle Name" id="middleName"
                            title="Middle Name" required="true"
                            value="#{memberManagedBean.newMember.middleName}">
                            <f:validateRegex pattern=".*\p{Alpha}{3,16}" />
                        </p:inputText>

                        <h:outputLabel value="Last Name:" for="lastName" />
                        <p:inputText label="Last Name" id="lastName" title="Last Name"
                            required="true" value="#{memberManagedBean.newMember.lastName}">
                            <f:validateRegex pattern=".*\p{Alpha}{3,16}" />
                        </p:inputText>

                        <h:outputLabel value="Membership Date:" for="membershipDate" />
                        <p:calendar id="popupButtonCal" />

                        <f:facet name="footer">
                            <p:commandButton value="Save" 
                                actionListener="#{memberManagedBean.createOrUpdateListener}" />
                            <p:commandButton value="Cancel" immediate="true"
                                process="@this"
                                oncomplete="addMemberDialog.hide()" />
                        </f:facet>
                    </p:panelGrid>
                </h:form>
            </p:dialog>
        </ui:define>
    </ui:composition>
</h:body>
</html>

在 firefox 上，没有遇到任何问题。出现对话框。

但是在 Chrome 和 IE 上，当我点击按钮时没有任何反应。
IE 还提示 addMemberDialog 未定义。

另一个奇怪的事情，只有 Firefox 生成我的页脚和完整的 </body> and </html>结束标签这很奇怪。 IE8 和 Chrome 似乎都生成了无效的 HTML 结构。

有谁知道原因吗？

更新:这是直接从 IE 中获取的生成的 HTML。请注意，没有结束主体和 html 标记。

<!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"><head><link type="text/css" rel="stylesheet" href="/SI/faces/javax.faces.resource/theme.css?ln=primefaces-aristo" /><link type="text/css" rel="stylesheet" href="/SI/faces/javax.faces.resource/common.css?ln=css" /><link type="text/css" rel="stylesheet" href="/SI/faces/javax.faces.resource/primefaces.css?ln=primefaces&amp;v=3.2" /><script type="text/javascript" src="/SI/faces/javax.faces.resource/jquery/jquery.js?ln=primefaces&amp;v=3.2"></script><script type="text/javascript" src="/SI/faces/javax.faces.resource/primefaces.js?ln=primefaces&amp;v=3.2"></script>
    <title>Sample App
    </title></head><body>
    <div id="header">
            <!-- &lt;h1&gt;SI Management System&lt;/h1&gt; -->
            <h2>Testing</h2>
            <!--  include your header file or uncomment the include below and create header.xhtml in this directory -->
            <!-- &lt;ui:include src=&quot;header.xhtml&quot;/&gt; -->
    </div>


    <div id="content">
<form id="memberListForm" name="memberListForm" method="post" action="/SI/faces/pages/members/showmembers.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="memberListForm" value="memberListForm" />
<div id="memberListForm:j_idt12" class="ui-panel ui-widget ui-widget-content ui-corner-all search-panel"><div id="memberListForm:j_idt12_content" class="ui-panel-content ui-widget-content"><table>
<tbody>
<tr>
<td><span class="label">First Name:</span></td>
<td><input type="text" name="memberListForm:j_idt15" /></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td><span class="label">Last Name:</span></td>
<td><input type="text" name="memberListForm:j_idt18" /></td>
</tr>
</tbody>
</table>
<button id="memberListForm:j_idt19" name="memberListForm:j_idt19" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" type="submit"><span class="ui-button-text">Search</span></button><script id="memberListForm:j_idt19_s" type="text/javascript">PrimeFaces.cw('CommandButton','widget_memberListForm_j_idt19',{id:'memberListForm:j_idt19'});</script><button id="memberListForm:j_idt20" name="memberListForm:j_idt20" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" onclick="addMemberDialog.show();" type="button"><span class="ui-button-text">Add New Member</span></button><script id="memberListForm:j_idt20_s" type="text/javascript">PrimeFaces.cw('CommandButton','widget_memberListForm_j_idt20',{id:'memberListForm:j_idt20'});</script></div></div><script id="memberListForm:j_idt12_s" type="text/javascript">PrimeFaces.cw('Panel','widget_memberListForm_j_idt12',{id:'memberListForm:j_idt12'});</script><div id="memberListForm:membersTable" class="ui-datatable ui-widget"><table role="grid"><thead><tr><th id="memberListForm:membersTable_paginator_top" class="ui-paginator ui-paginator-top ui-widget-header" colspan="5"><span class="ui-paginator-current">(1 of 1)</span> <span class="ui-paginator-first ui-state-default ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-seek-first">p</span></span><span class="ui-paginator-prev ui-state-default ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-seek-prev">p</span></span><span class="ui-paginator-pages"><span class="ui-paginator-page ui-state-default ui-state-active ui-corner-all">1</span></span><span class="ui-paginator-next ui-state-default ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-seek-next">p</span></span><span class="ui-paginator-last ui-state-default ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-seek-end">p</span></span><select class="ui-paginator-rpp-options ui-widget ui-state-default ui-corner-left" value="10"><option value="5">5</option><option value="10" selected="selected">10</option><option value="15">15</option></select></th></tr><tr role="row"><th id="memberListForm:membersTable:j_idt35" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span></span></div></th><th id="memberListForm:membersTable:j_idt24" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span></span></div></th><th id="memberListForm:membersTable:j_idt41" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span></span></div></th><th id="memberListForm:membersTable:j_idt44" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span></span></div></th><th id="memberListForm:membersTable:j_idt47" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span></span></div></th></tr></thead><tfoot><tr><td id="memberListForm:membersTable_paginator_bottom" class="ui-paginator ui-paginator-bottom ui-widget-header" colspan="5"><span class="ui-paginator-current">(1 of 1)</span> <span class="ui-paginator-first ui-state-default ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-seek-first">p</span></span><span class="ui-paginator-prev ui-state-default ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-seek-prev">p</span></span><span class="ui-paginator-pages"><span class="ui-paginator-page ui-state-default ui-state-active ui-corner-all">1</span></span><span class="ui-paginator-next ui-state-default ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-seek-next">p</span></span><span class="ui-paginator-last ui-state-default ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-seek-end">p</span></span><select class="ui-paginator-rpp-options ui-widget ui-state-default ui-corner-left" value="10"><option value="5">5</option><option value="10" selected="selected">10</option><option value="15">15</option></select></td></tr></tfoot><tbody id="memberListForm:membersTable_data" class="ui-datatable-data ui-widget-content"><tr data-ri="0" data-rk="1" class="ui-widget-content ui-datatable-even" role="row" aria-selected="false"><td role="gridcell"><div class="ui-dt-c">john cesar</div></td><td role="gridcell"><div class="ui-dt-c">jamora</div></td><td role="gridcell"><div class="ui-dt-c">alojado</div></td><td role="gridcell"><div class="ui-dt-c">Dec 31, 2009</div></td><td role="gridcell"><div class="ui-dt-c">A</div></td></tr><tr data-ri="1" data-rk="2" class="ui-widget-content ui-datatable-odd" role="row" aria-selected="false"><td role="gridcell"><div class="ui-dt-c">frank</div></td><td role="gridcell"><div class="ui-dt-c"></div></td><td role="gridcell"><div class="ui-dt-c">nimphius</div></td><td role="gridcell"><div class="ui-dt-c">May 31, 2008</div></td><td role="gridcell"><div class="ui-dt-c">A</div></td></tr><tr data-ri="2" data-rk="3" class="ui-widget-content ui-datatable-even" role="row" aria-selected="false"><td role="gridcell"><div class="ui-dt-c">buboy</div></td><td role="gridcell"><div class="ui-dt-c"></div></td><td role="gridcell"><div class="ui-dt-c">closas</div></td><td role="gridcell"><div class="ui-dt-c">Oct 10, 2011</div></td><td role="gridcell"><div class="ui-dt-c">A</div></td></tr><tr data-ri="3" data-rk="4" class="ui-widget-content ui-datatable-odd" role="row" aria-selected="false"><td role="gridcell"><div class="ui-dt-c">imee norwene</div></td><td role="gridcell"><div class="ui-dt-c">alojado</div></td><td role="gridcell"><div class="ui-dt-c">ellen</div></td><td role="gridcell"><div class="ui-dt-c">Mar 02, 2004</div></td><td role="gridcell"><div class="ui-dt-c">A</div></td></tr><tr data-ri="4" data-rk="5" class="ui-widget-content ui-datatable-even" role="row" aria-selected="false"><td role="gridcell"><div class="ui-dt-c">jon</div></td><td role="gridcell"><div class="ui-dt-c"></div></td><td role="gridcell"><div class="ui-dt-c">jone</div></td><td role="gridcell"><div class="ui-dt-c">Jan 08, 2000</div></td><td role="gridcell"><div class="ui-dt-c">A</div></td></tr><tr data-ri="5" data-rk="6" class="ui-widget-content ui-datatable-odd" role="row" aria-selected="false"><td role="gridcell"><div class="ui-dt-c">frank</div></td><td role="gridcell"><div class="ui-dt-c"></div></td><td role="gridcell"><div class="ui-dt-c">mir</div></td><td role="gridcell"><div class="ui-dt-c">Aug 10, 2004</div></td><td role="gridcell"><div class="ui-dt-c">A</div></td></tr><tr data-ri="6" data-rk="7" class="ui-widget-content ui-datatable-even" role="row" aria-selected="false"><td role="gridcell"><div class="ui-dt-c">ted</div></td><td role="gridcell"><div class="ui-dt-c"></div></td><td role="gridcell"><div class="ui-dt-c">o'connor</div></td><td role="gridcell"><div class="ui-dt-c">Jan 01, 2002</div></td><td role="gridcell"><div class="ui-dt-c">A</div></td></tr></tbody></table><input type="hidden" id="memberListForm:membersTable_selection" name="memberListForm:membersTable_selection" autocomplete="off" value="" /></div><script id="memberListForm:membersTable_s" type="text/javascript">$(function() {PrimeFaces.cw('DataTable','widget_memberListForm_membersTable',{id:'memberListForm:membersTable',paginator:{id:['memberListForm:membersTable_paginator_top','memberListForm:membersTable_paginator_bottom'],rows:10,rowCount:7,page:0,currentPageTemplate:'({currentPage} of {totalPages})'},selectionMode:'single'});});</script>

最佳答案

呜呜呜....

罪魁祸首就在这一行

<p:dialog id="addMemberDialog" header="Member Details"
                widgetVar="addMemberDialog" resizable="false" closable="false">

根据这篇文章中的 Cagatay http://forum.primefaces.org/viewtopic.php?f=3&t=18830 componentId 和 widgetVar 不能重名。

我没能解决这个问题，我只在 Firefox 上测试，我没有遇到问题。

只有在 IE 和 Chrome 帽子中测试时我才注意到这个问题。

无论如何，我只是回答了我自己的问题，认为有人可能会遇到这个问题。

版主可以关闭此答案。

关于素面 3 : Component ID and Widget Var should not have the same name，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10579619/

文章推荐： hibernate - 连接到 Hibernate 的查询生成

文章推荐： xaml - 修改 ListPicker 的全屏设计

文章推荐： xslt - 如何使用 XSLT 在中包含文件的所有内容？

文章推荐： Mercurial 进程内钩子(Hook)，GPLv2+ "derived work"与否？

widget - 究竟是什么定义了 "widget"？
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the he
css - 为什么 .ui-widget 匹配 .ui-widget .ui-widget
我正在试验 jquery-ui 并查看和克隆一些示例。在一个示例(自动完成的组合框)中，我看到一个带有 ui-widget 类的 anchor (a) 元素，它与包含的 css 文件中的 .ui-wi
delphi - IfThen(Assigned(Widget), Widget.Description, 'No Widget' ) 不会崩溃。应该是？
在我帮助维护的代码中，我发现了多个如下所示的代码示例: Description := IfThen(Assigned(Widget), Widget.Description, 'No Widget')
CSS选择器策略 : (Prefix using a parent class: . widget .widget-item {}) or (Directly : . widget-item {})
这个问题在这里已经有了答案: CSS Performance Question (8 个答案) 关闭 9 年前。这是一个很常见的情况。假设我们有一些标记: 我们可以使用 2 个选项来
html - 我可以使用 css 选择器来匹配 widget-logs 和 widget-chart 吗，比如 widget-* {...}
这个问题在这里已经有了答案: CSS: Class name selector- name starts with (2 个答案) 关闭 5 年前。
How to Dynamically Increase the Height of a Widget in a Flutter Row Widget Based on Another Flexible Widget(如何基于另一个灵活的小部件动态增加扑动排小部件中小部件的高度)
我有一个布局，其中Row小部件中有两个子部件，这两个都是灵活的小部件。左侧的小部件包含红色和蓝色的小部件，我希望根据右侧小部件的高度增加蓝色小部件的高度(这是一个灵活的小部件，其FLEX值为7)。。例
How to Dynamically Increase the Height of a Widget in a Flutter Row Widget Based on Another Flexible Widget(如何基于另一个灵活的小部件动态增加扑动排小部件中小部件的高度)
我有一个布局，其中Row小部件中有两个子部件，这两个都是灵活的小部件。左侧的小部件包含红色和蓝色的小部件，我希望根据右侧小部件的高度增加蓝色小部件的高度(这是一个灵活的小部件，其FLEX值为7)。。例
android - 参数类型 'Widget Function(BuildContext)' 不能分配给参数类型 'Widget Function(BuildContext, Widget)' Flutter 中的错误
这是一个代码: import 'package:flutter/material.dart'; import 'package:flutterapp/ui/pages/notes_home.dart'
Flutter:如何检查 Widget 是否是一个滚动的 widget
ListView、GridView、SingleChildScrollView 等小部件是可滚动的小部件，而Container、SizedBox, Column 不是。有没有办法检查 Widget
widget - 如何使用 IPython Widgets 让一个参数的可能值依赖于另一个参数？
假设我在 Python 中有这个简单的函数: def f(gender, name): if gender == 'male': return ranking_male(nam
android-widget - Android Widgets 独立的应用程序？
我不想听起来像个糟糕的新手，但是小部件是独立的应用程序吗？例如，我正在为 Android 创建一个新闻阅读器应用程序，我想要一个主屏幕小部件。我是将小部件创建为 Hook 到其他应用程序的单独项目/应
widget - 如何获得 Tk Widget 的子级？
如何告诉 Tk 小部件告诉我它的子级是什么(或谁，视情况而定)？有这个命令吗？例如，给定一个带有标签、按钮和其他装饰的 Canvas 小部件 .cvs ...如何查询 Canvas ？最佳答案 w
Android 应用 Widget 更新新版本删除现有的 widget
我为 Android 开发了一个 APP + 主屏幕小部件。现在我更新了应用程序(增加了版本代码/名称)但是当我安装时，它不会自动替换屏幕上现有的小部件。它只是说“问题加载小部件”。有什么想法吗？？
android-widget - 如何调整 Android Widget 的大小？
我是小部件开发的新手..我设法构建了一个无法调整大小的小部件..我希望它像 - 用户设法根据自己调整大小......有人可以告诉我如何制作它可能吗？谢谢 friend 。最佳答案 AppWidge
Flutter 在 List 中查找 Widget
我有一个小部件列表: List widgetList = List(); widgetList.add(WidgetA()); widgetList.add(WidgetB()); widgetLis
widget - iOS 8 Today Widget 和锁定设备
对不起，我的英语不好! 我开发了一个今日小部件。我需要从小部件启动 map 应用程序(例如)，并且在设备锁定时不工作。在这种情况下如何检测锁定的设备并启动解锁屏幕？问候，最佳答案而不是使用 UI
android-widget - 是否可以向 android Widget 添加广告？
我正在尝试制作我的小部件的免费版本，我想向小部件添加广告，这可能吗？如果是这样怎么办？最佳答案小部件应用程序中的 View 仅限于: 模拟时钟按钮天文台图像按钮 ImageView 进度条
java - Android Widget 未出现在 Widget 列表中
我在 Android Studio 中创建了一个新项目，然后添加了一个新的小部件并在我的 Nexus 5 5.1 上运行该应用程序，它可以工作，但是当尝试将小部件添加到主屏幕时，它没有出现在小部件列表
Python tkinter : access child widgets of a widget
我有一个字符串 'currentMessage' 和一个用于显示它的标签。我有一个 Toplevel 小部件，其中包含一个文本小部件，为“currentMessage”提供新值: from tkint
android - 多个 Android Widget 实例只更新最后一个 widget
我尝试使用这个 link 解决我的问题 update - I figured out that there is something wrong with the setter of the pend

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

素面 3 : Component ID and Widget Var should not have the same name