当内容动态更新时,Richfaces 弹出面板不会自动调整大小
Richfaces popup panel does not get autosized when its content is dynamically updated
我有一个带有两个 selectOneMenus 的丰富的 popupPanel,使用时它们会在弹出窗口中呈现更多组件。主要问题是弹出面板在呈现组件时不会自动调整大小。当我更新到 richfaces 4.3.7 时出现了这个问题,但是这个版本解决了我遇到的另一个问题,所以我不想回到以前的版本。
<rich:popupPanel id="editAccessPopup" modal="true" autosized="true" domElementAttachment="parent">
<f:facet name="controls">
<h:outputLink value="#"
onclick="#{rich:component('editAccessPopup')}.hide(); return false;"> X </h:outputLink>
</f:facet>
<h:form id="edit_access_popup_form">
<a4j:outputPanel id="outputPanel" layout="block">
<legend style="font-weight: bold;">Edit Access</legend>
<rich:panel>
<h:panelGrid columns="2" style="width:100%"
columnClasses="panelgrid_label_column, panelgrid_input_column">
<h:outputLabel style="font-weight: bold; align:left;"
value="Type"
for="edit_access_access_type_menu" />
<h:selectOneMenu id="edit_access_access_type_menu"
value="#{serviceDesignBean.accessTypeSelectData.selectedIndex}"
valueChangeListener="#{serviceDesignBean.valueChangedForAccessType}" >
<f:selectItem itemValue=""
itemLabel="#{lbl.default_selectitem_value}" />
<f:selectItems
value="#{serviceDesignBean.accessTypeSelectData.list}"
var="accessType" itemValue="#{accessType.value}"
itemLabel="#{accessType.label}" />
<a4j:ajax event="valueChange"
render="service_id_panel, edit_access_popup_form"
execute="@this" />
</h:selectOneMenu>
<h:outputLabel style="font-weight: bold; align:left;"
value="#{lbl.edit_access_popup_service_action}"
for="edit_access_service_action_menu" />
<h:selectOneMenu id="edit_access_service_action_menu"
value="#{serviceDesignBean.accessActionSelectData.selectedIndex}"
valueChangeListener="#{serviceDesignBean.valueChangedForAccessAction}">
<f:selectItem itemValue=""
itemLabel="#{lbl.default_selectitem_value}" />
<f:selectItems
value="#{serviceDesignBean.accessActionSelectData.list}"
var="accessAction" itemValue="#{accessAction.value}"
itemLabel="#{accessAction.label}" />
<a4j:ajax event="valueChange"
render="service_id_panel, edit_access_popup_form"
execute="@this" />
</h:selectOneMenu>
<h:outputLabel value="Service Id" for="input_service_id"
style="font-weight: bold; align:left;" />
<a4j:outputPanel id="service_id_panel" layout="block">
<h:inputText id="input_service_id"
value="#{serviceDesignBean.inputServiceId}"
disabled="#{not serviceDesignBean.serviceIdFlag}" />
</a4j:outputPanel>
</h:panelGrid>
</rich:panel>
</a4j:outputPanel>
<h:panelGroup id="access_attr_panel"
style="margin-left:20px;margin-top:20px;"
rendered="#{not empty serviceDesignBean.accessActionSelectData.selectedIndex and not empty serviceDesignBean.accessTypeSelectData.selectedIndex}">
<fieldset>
<legend>#{lbl.sol_manag_service_Attributes}</legend>
<h:panelGrid style="margin-left:20px;" class="gridStyle"
columnClasses="panelgrid_label_column,panelgrid_imput_column"
columns="2">
<h:outputText value="#{lbl.ServiceAttributeName_SPEED}"
rendered="#{serviceDesignBean.serviceAttrVisibility.visibilityToSpeed}" />
<a4j:outputPanel layout="block"
rendered="#{serviceDesignBean.serviceAttrVisibility.visibilityToSpeed}">
<h:selectOneMenu
disabled="#{not serviceDesignBean.serviceAttrVisibility.editableSpeed}"
value="#{serviceDesignBean.selectedSpeed}">
<f:selectItem itemValue=""
itemLabel="#{lbl.default_selectitem_value}" />
<f:selectItems value="#{serviceDesignBean.accessSpeedList}"
var="speed" itemValue="#{speed.speedValue}"
itemLabel="#{speed.speedValue}" />
<a4j:ajax event="valueChange" execute="@this" />
</h:selectOneMenu>
</a4j:outputPanel>
...more components to get rendered...
<a4j:commandButton id="save_access_btn"
value="#{lbl.service_design_save_edited_access}"
onclick="#{rich:component('editAccessPopup')}.hide()"
actionListener="#{serviceDesignBean.saveEditedAccess}"
render=":pending_services, :accesses_form"
oncomplete="javascript:location.reload(true)"></a4j:commandButton>
</h:form>
</rich:popupPanel>
我在这里发现:https://developer.jboss.org/thread/241593 我可以使用 panel.doResizeOrMove(RichFaces.ui.PopupPanel.Sizer.Diff.EMPTY); 来强制调整弹出窗口的大小。我有两个问题:
- 你能告诉我如何使用上述函数调整弹出窗口的大小吗?
- 还有其他方法可以解决我的问题吗?
提前致谢!
您只需调用该方法,就像您关闭面板时那样:
#{rich:component('editAccessPopup')}.doResizeOrMove(RichFaces.ui.PopupPanel.Sizer.Diff.EMPTY);
至于其他选项,您可以重新渲染整个面板。将 oncomplete="#{rich:component('editAccessPopup')}.show();
添加到命令按钮以再次显示面板。
我有一个带有两个 selectOneMenus 的丰富的 popupPanel,使用时它们会在弹出窗口中呈现更多组件。主要问题是弹出面板在呈现组件时不会自动调整大小。当我更新到 richfaces 4.3.7 时出现了这个问题,但是这个版本解决了我遇到的另一个问题,所以我不想回到以前的版本。
<rich:popupPanel id="editAccessPopup" modal="true" autosized="true" domElementAttachment="parent">
<f:facet name="controls">
<h:outputLink value="#"
onclick="#{rich:component('editAccessPopup')}.hide(); return false;"> X </h:outputLink>
</f:facet>
<h:form id="edit_access_popup_form">
<a4j:outputPanel id="outputPanel" layout="block">
<legend style="font-weight: bold;">Edit Access</legend>
<rich:panel>
<h:panelGrid columns="2" style="width:100%"
columnClasses="panelgrid_label_column, panelgrid_input_column">
<h:outputLabel style="font-weight: bold; align:left;"
value="Type"
for="edit_access_access_type_menu" />
<h:selectOneMenu id="edit_access_access_type_menu"
value="#{serviceDesignBean.accessTypeSelectData.selectedIndex}"
valueChangeListener="#{serviceDesignBean.valueChangedForAccessType}" >
<f:selectItem itemValue=""
itemLabel="#{lbl.default_selectitem_value}" />
<f:selectItems
value="#{serviceDesignBean.accessTypeSelectData.list}"
var="accessType" itemValue="#{accessType.value}"
itemLabel="#{accessType.label}" />
<a4j:ajax event="valueChange"
render="service_id_panel, edit_access_popup_form"
execute="@this" />
</h:selectOneMenu>
<h:outputLabel style="font-weight: bold; align:left;"
value="#{lbl.edit_access_popup_service_action}"
for="edit_access_service_action_menu" />
<h:selectOneMenu id="edit_access_service_action_menu"
value="#{serviceDesignBean.accessActionSelectData.selectedIndex}"
valueChangeListener="#{serviceDesignBean.valueChangedForAccessAction}">
<f:selectItem itemValue=""
itemLabel="#{lbl.default_selectitem_value}" />
<f:selectItems
value="#{serviceDesignBean.accessActionSelectData.list}"
var="accessAction" itemValue="#{accessAction.value}"
itemLabel="#{accessAction.label}" />
<a4j:ajax event="valueChange"
render="service_id_panel, edit_access_popup_form"
execute="@this" />
</h:selectOneMenu>
<h:outputLabel value="Service Id" for="input_service_id"
style="font-weight: bold; align:left;" />
<a4j:outputPanel id="service_id_panel" layout="block">
<h:inputText id="input_service_id"
value="#{serviceDesignBean.inputServiceId}"
disabled="#{not serviceDesignBean.serviceIdFlag}" />
</a4j:outputPanel>
</h:panelGrid>
</rich:panel>
</a4j:outputPanel>
<h:panelGroup id="access_attr_panel"
style="margin-left:20px;margin-top:20px;"
rendered="#{not empty serviceDesignBean.accessActionSelectData.selectedIndex and not empty serviceDesignBean.accessTypeSelectData.selectedIndex}">
<fieldset>
<legend>#{lbl.sol_manag_service_Attributes}</legend>
<h:panelGrid style="margin-left:20px;" class="gridStyle"
columnClasses="panelgrid_label_column,panelgrid_imput_column"
columns="2">
<h:outputText value="#{lbl.ServiceAttributeName_SPEED}"
rendered="#{serviceDesignBean.serviceAttrVisibility.visibilityToSpeed}" />
<a4j:outputPanel layout="block"
rendered="#{serviceDesignBean.serviceAttrVisibility.visibilityToSpeed}">
<h:selectOneMenu
disabled="#{not serviceDesignBean.serviceAttrVisibility.editableSpeed}"
value="#{serviceDesignBean.selectedSpeed}">
<f:selectItem itemValue=""
itemLabel="#{lbl.default_selectitem_value}" />
<f:selectItems value="#{serviceDesignBean.accessSpeedList}"
var="speed" itemValue="#{speed.speedValue}"
itemLabel="#{speed.speedValue}" />
<a4j:ajax event="valueChange" execute="@this" />
</h:selectOneMenu>
</a4j:outputPanel>
...more components to get rendered...
<a4j:commandButton id="save_access_btn"
value="#{lbl.service_design_save_edited_access}"
onclick="#{rich:component('editAccessPopup')}.hide()"
actionListener="#{serviceDesignBean.saveEditedAccess}"
render=":pending_services, :accesses_form"
oncomplete="javascript:location.reload(true)"></a4j:commandButton>
</h:form>
</rich:popupPanel>
我在这里发现:https://developer.jboss.org/thread/241593 我可以使用 panel.doResizeOrMove(RichFaces.ui.PopupPanel.Sizer.Diff.EMPTY); 来强制调整弹出窗口的大小。我有两个问题:
- 你能告诉我如何使用上述函数调整弹出窗口的大小吗?
- 还有其他方法可以解决我的问题吗?
提前致谢!
您只需调用该方法,就像您关闭面板时那样:
#{rich:component('editAccessPopup')}.doResizeOrMove(RichFaces.ui.PopupPanel.Sizer.Diff.EMPTY);
至于其他选项,您可以重新渲染整个面板。将 oncomplete="#{rich:component('editAccessPopup')}.show();
添加到命令按钮以再次显示面板。