Question

如何在p：dataTable中执行多行选择，该对话框具有modal =＆＃34; true＆＃34;并且该对话框位于ui：composition元素中，并且该ui组合元素放置在布局中。

1个问题:(让我们假设现在p：对话框没有放在布局中）除非你删除appendToBody =＆＃34; true＆＃34;否则你不能在p：dataTable中执行多个选择，它包含在p：dialog元素中。并添加transient =＆＃34; true＆＃34;。所以现在我们有模态对话框，其中p：dataTable具有多个选择，所有内容都放在ui：composition中。表格如何：

<ui:composition xmlns="http://www.w3c.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions"
xmlns:c="http://java.sun.com/jsp/jstl/core"
template="/layout/layout.xhtml">
<ui:define>
<h:form>
    <p:commandButton id="multiViewButton" value="View" 
    update=":form:multiCars" onclick="dlg2.show();" type="button"/> 
</h:form>

<h:form id="form">   
  <p:dialog id="modalDialog" header="Pasirinkimas" widgetVar="dlg2" 
modal="true" height="300" transient="true" resizable="false" selectionMode="multiple">  
  <p:dataTable id="multiCars" var="car" value="#{tableBean.mediumCarsModel}" paginator="true" rows="10" selection="#{tableBean.selectedCars}">

    <p:column headerText="Model" style="width:25%">  
        #{car.model}  
    </p:column>  

    <p:column headerText="Year" style="width:25%">  
        #{car.year}  
    </p:column>  

    <p:column headerText="Manufacturer" style="width:24%">  
        #{car.manufacturer}  
    </p:column>  

    <p:column headerText="Color" style="width:24%">  
        #{car.color}  
    </p:column>  

</p:dataTable>  

<p:commandButton id="multiViewButton" value="View" icon="ui-icon-search"  
    update=":form:displayMulti" oncomplete="multiCarDialog.show()" process="multiCars"/> 
  </p:dialog>
    <p:dialog id="multiDialog" header="Car Detail" widgetVar="multiCarDialog"  
        height="300" showEffect="fade" hideEffect="explode">  

            <p:dataList id="displayMulti" value="#{tableBean.selectedCars}" var="selectedCar">  
            Model: #{selectedCar.model}, Year: #{selectedCar.year}  
        </p:dataList>  
    </p:dialog>  
</h:form> 
</ui:define> 
</ui:composition>

2问题。有趣的部分然后开始这个ui：组合被放置在布局中。然后p：dialog的屏蔽就会出现在对话框本身的前面。解决方案是添加appendToBody =＆＃34; true＆＃34;，然后多个选择停止工作并且它不正常。另一种解决方案是在layout元素之外放置对话框，但我们在ui：composition元素中，因此不会起作用。我的最终解决方案是通过设置modal =＆＃34; false＆＃34;来禁用p：dialog模态属性。但我对它并不满意。

有没有什么方法可以在数据表中实现多行选择，这是在对话框中放置的，ui：带有转动的p：dialog模态属性的构图和布局？

Answer 1

原来p：对话框必须移到表单之外，表单必须放在对话框中，并且必须添加appendToBody =“true”属性而不是transient =“true” 因此代码看起来与此类似：

<p:dialog id="modalDialog" header="Pasirinkimas" widgetVar="dlg2" modal="true" height="300" appendToBody="true" resizable="false" selectionMode="multiple">  
  <h:form id="form">
  <p:dataTable id="multiCars" var="car" value="#{tableBean.mediumCarsModel}" paginator="true" rows="10" selection="#{tableBean.selectedCars}">

  <p:column headerText="Model" style="width:25%">  
    #{car.model}  
  </p:column>  

  <p:column headerText="Year" style="width:25%">  
    #{car.year}  
  </p:column>  

  <p:column headerText="Manufacturer" style="width:24%">  
    #{car.manufacturer}  
  </p:column>  

  <p:column headerText="Color" style="width:24%">  
    #{car.color}  
  </p:column>  

  </p:dataTable>  

  <p:commandButton id="multiViewButton" value="View" icon="ui-icon-search"  
update=":form:displayMulti" oncomplete="multiCarDialog.show()" process="multiCars"/> 
 </h:form>
</p:dialog>

这是因为appendToBody =“true”将元素置于当前上下文之外并将其附加到文档正文的底部，因此没有包装p：dialog的表单，因此我们需要在p：对话框中插入表单

Primefaces。数据表中的多行选择，在模态对话框中，ui：组合，布局

1 个答案: