Исправлено положение кнопок в диалоге страницы JSF - PullRequest
Новая
       32

Исправлено положение кнопок в диалоге страницы JSF

1 голос
/ 03 мая 2019

Я использую диалог PrimeFaces.У меня там всего несколько элементов.DataTable и 2 кнопки (Ok и Отмена).Но кнопки отображаются внизу и видны только тогда, когда я прокручиваю всю таблицу вниз.Я хочу, чтобы они всегда отображались внизу, независимо от того, нахожусь ли я в первом или последнем ряду.Я много искал, но не нашел ничего, что работает.Вот фрагмент из моего кода: 

<f:facet name="{SelectPrijemca}">
                            <div class="Fs14 Absolute" style="right: 11px; top: 4px">
                                <p:outputLabel value="#{MAService.selectedPrijemca.nazO}" style="color:white"/>
                                <p:spacer width="7px"/>
                                <p:commandButton value="Príjemca" id="selectPrijemcaButton" icon="fa fa-user" rendered="#{MAService.managerAccess}"
                                                 onclick="PF('PrijemcaDialogWidget').show();" style="margin-top:2px">
                                </p:commandButton>
                            </div>
                            <p:dialog id="PrijemcaDialog" header="Vybrať príjemcu" widgetVar="PrijemcaDialogWidget" showEffect="fade" hideEffect="fade" height="600" width="1300" position="center" modal="false" resizable="false" >
                                <h:form id="prijemcaForm">
                                        <p:dataTable 
                                            id="prijemcaTable" 
                                            scrollable="false"
                                            var="prijemca"
                                            widgetVar="prijemcaTableWidget" 
                                            value="#{MAService.prijemcoviaList}"
                                            selectionMode="single" 
                                            filteredValue="#{MAService.filteredPrijemcovia}"
                                            emptyMessage="#{messages.localizeEShop('webclient$datatable.tableEmpty')}"
                                            selection="#{MAService.selectedPrijemca}"
                                            rowKey="#{prijemca.id}" >

                                            <p:column width="50"
                                                filterBy="#{prijemca.nazO}" filterMatchMode="contains"
                                                filterStyleClass="narrowEdit"
                                                headerText="#{messages.localizeEShop('webclient$subfiles.lo.LOObjWeb.cols.PrijNaz')}"
                                                sortBy="#{prijemca.nazO}" styleClass="TexAlLeft"
                                                style="white-space: nowrap !important;>
                                                <h:outputText value="#{prijemca.nazO}" styleClass="TexAlLeft" style="color: gray"/>
                                            </p:column>
                                            <p:column width="5"
                                                filterBy="#{prijemca.ici}" filterMatchMode="contains"
                                                filterStyleClass="narrowEdit"
                                                headerText="#{messages.localizeEShop('webclient$subfiles.lo.LOObjWeb.cols.PrijIci')}"
                                                sortBy="#{prijemca.ici}" styleClass="TexAlLeft"
                                                style="white-space: nowrap !important;>
                                                <h:outputText value="#{prijemca.ici}" styleClass="TexAlLeft" style="color: gray"/>
                                            </p:column>
                                        </p:dataTable>
                                    <p:panelGrid columns="2">
                                        <p:commandButton value="OK" icon="fa fa-check" process="prijemcaForm" actionListener="#{MAService.changePrijemca()}" update="contentForm"/>
                                        <p:commandButton value="Zrušiť" icon="fa fa-times" onclick="PF('PrijemcaDialogWidget').hide()" style="background-color:red"/>
                                    </p:panelGrid>
                                </h:form>
                            </p:dialog> 

                        </f:facet>

И только одна заметка, я не могу сделать прокручиваемый dataTable, потому что я использую этот фасет в paginatorTemplate другого dataTable, и он каким-то образом делает прокручиваемым всю страницу, где находится эта таблица..

Я нашел одно частичное решение, когда обернул панель Grid, где кнопки с: 

<div style="position: fixed; width: 65%; top: 70%; left: 16%></div>

Но это не исправляет кнопки в диалоге, а на всей странице.Поэтому, когда есть способ сделать диалог неподвижным (перетаскиваемым), я мог бы пойти по этому пути.

1 Ответ

1 голос
/ 03 мая 2019

попытайтесь поместить вашу таблицу данных в выходную панель и добавьте стиль 

<p:outputPanel id="opScrl" style="height:560px;overflow:auto">
  <p:dataTable ...>
  </p:dataTable>
</p:outputPanel>
...