[英]Bad Format frozenlayout-right with SB admin
I'm trying to integrate scrolling data-table in SB Admin template referenced by https://startbootstrap.com/themes/sb-admin-2/我正在尝试将滚动数据表集成到https://startbootstrap.com/themes/sb-admin-2/引用的 SB 管理模板中
That's ok in a simple html page.这在一个简单的 html 页面中是可以的。
But, I encounter an arbitrary space when using the data-table is included under SB Admin template.但是,我在使用 SB Admin 模板下包含的数据表时遇到了任意空间。
I got that:我明白了:
Could you please tell me what I missed, knowing that my html is:你能告诉我我错过了什么,知道我的 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"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
<style>
body
{
background-image: url('../resources/icons/espingj.png')
}
</style>
</h:head>
<h:body>
<br/><br/><br/><br/>
<center>
<h:outputText value="Enquête de Satisfaction pour la classe " style="color:red;font-size: 20px"/>
<h:outputText value=" #{manageBean.connectedUser.classecourantet}" style="color:#0000ff;font-size: 20px"/>
</center>
<br/>
<div align="right">
<h:outputText value="Veuillez exprimé votre satisfaction:" style="color:blue;font-size: 13px;font-style: italic;"/>
<p:spacer width="5px"/>
<h:outputText value="I-" style="color:red;font-size: 13px;font-style: italic;font-weight: bold;"/>
<h:outputText value="Insatisfait" style="color:red;font-size: 13px;font-style: italic"/>
<p:spacer width="10px"/>
<h:outputText value="O-" style="color:grey;font-size: 13px;font-style: italic;font-weight: bold;"/>
<h:outputText value="Ordinaire" style="color:grey;font-size: 13px;font-style: italic"/>
<p:spacer width="10px"/>
<h:outputText value="S-" style="color:green;font-size: 13px;font-style: italic;font-weight: bold;"/>
<h:outputText value="Satisfait" style="color:green;font-size: 13px;font-style: italic"/>
<br/><br/>
<h:form id="drawDataTable">
<h:outputText value="(*) Merci de terminer votre procesus de satisfaction !."
rendered="#{manageBean.phase2 eq 'avoid'}" update="@all"
style="color:red;font-size: 13px;font-style: italic;font-weight: bold;"/>
<h:outputScript target="drawDataTable">
$(function()
{
synchronizeRowsHeight();
});
function synchronizeRowsHeight()
{
var $leftRows = $('.ui-datatable-frozenlayout-left').find('tr');
var $rightRows = $('.ui-datatable-frozenlayout-right').find('tr');
$leftRows.each(function(index)
{
var $leftRow = $(this);
var $leftHeight = $leftRow.innerHeight();
var $rightRow = $rightRows.eq(index);
var $rightHeight = $rightRow.innerHeight();
if ($rightHeight > $leftHeight)
{
$leftRow.innerHeight($rightHeight);
var diff = $rightHeight - $leftRow.innerHeight();
if (diff != 0)
$leftRow.innerHeight($rightHeight + diff);
$(window).trigger('resize');
}
$(".ui-datatable-scrollable-body").height(totalHeight-50);
})
}
</h:outputScript>
<p:dataTable var="criteria" value="#{manageBean.lnomFourthCriterions}" id="data4"
scrollable="true" scrollWidth="695" frozenColumns="1"
resizableColumns="true" styleClass="fixed-size"
tableStyle="width: auto; white-space: nowrap;">
<p:columnGroup type="frozenHeader" id="aa">
<p:row>
<p:column rowspan="2" headerText="Critères d'enseignement" escape="false" style="white-space:pre-line;"/>
</p:row>
</p:columnGroup>
<p:columnGroup type="scrollableHeader" id="bb">
<p:row>
<p:column colspan="#{manageBean.yearCount}" headerText="#{manageBean.lcs.get(18).value}" />
</p:row>
<p:row>
<ui:repeat value="#{manageBean.lms}" var="module">
<p:column headerText="#{manageBean.findModuleByCode(module)}" style="font-size: 10px;"/>
</ui:repeat>
</p:row>
</p:columnGroup>
<p:column width="10px" style="height: 50px">
<h:outputText value="#{criteria.libelleNom}" style="font-size: 12px"/>
</p:column>
<p:columns value="#{manageBean.lms}" var="module" width="1000px" style="font-size: 12px; height:50px">
<center>
<p:selectOneMenu styleClass="choices" required="true"
style="font-size: 11px;color:#737373;font-weight: normal;width:50%"
value="#{manageBean.selectedItemPriorityEnseignement}"
rendered="#{manageBean.getDisplaySelectedPriorityForEnseignement(criteria.abi.codeNom, module) eq null}">
<f:selectItems value="#{manageBean.getSelectItemsEnseignement(module)}"/>
<p:ajax update="drawDataTable" listener="#{manageBean.checkPriorityEns(criteria.abi.codeNom, manageBean.selectedItemPriorityEnseignement, module)}"/>
</p:selectOneMenu>
<p:spacer width="10px"/>
<h:outputText value="#{manageBean.getDisplaySelectedPriorityForEnseignement(criteria.abi.codeNom, module)}"
style="color:#0066ff;font-size: 13px;font-weight: bold;" rendered="#{manageBean.colorCellule(module) mod 2 == 0}"/>
<h:outputText value="#{manageBean.getDisplaySelectedPriorityForEnseignement(criteria.abi.codeNom, module)}"
style="color:#00ccff;font-size: 13px;font-weight: bold;" rendered="#{manageBean.colorCellule(module) mod 2 != 0}"/>
<p:spacer width="20px"/>
</center>
</p:columns>
</p:dataTable>
<center>
<br/><br/><br/>
<h:panelGrid columns="2">
<h:column>
<p:commandLink id="pre" action="secondPhase?faces-redirect=true">
<p:graphicImage value="/resources/icons/previous.png" style="width: 62px;height: 43px;"/>
</p:commandLink>
<p:tooltip for="pre" value="Précédant" style="font-size: 10px;" position="left"/>
</h:column>
<h:column>
<p:commandLink id="sui" ajax="true">
<p:graphicImage value="/resources/icons/next.png" style="width: 50px;height: 30px;"/>
<p:ajax update="@all" listener="#{manageBean.validatePhase2Step()}"/>
</p:commandLink>
<p:tooltip for="sui" value="Suivant" style="font-size: 10px;" position="right"/>
</h:column>
</h:panelGrid>
</center>
<br/><br/><br/>
</h:form>
</div>
</h:body>
</html>
Ok, It's clear that is a problem with好的,很明显这是一个问题
<p:column rowspan="2" headerText="Critères d'enseignements" style="white-space:pre-line; width: 500px;"/>
width on --> 尝试像这样指定列的宽度: <p:column rowspan="2" headerText="Critères d'enseignements" style="white-space:pre-line; width: 500px;"/>
Hope Helping希望有帮助
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.