JSF rich:extendedDataTable in rich:panel ist gestaucht

[gizmo]

Ich habe den unten stehenden Code in meinem Facelet, das Resultat ist im angehängten Bild zu sehen. Ich verwende Version 4.1 von RichFaces. Wie schaffe ich es, dass die Tabelle sich über die gesamte Breite des Panels erstreckt?

[XML]<?xml version="1.0" encoding="ISO-8859-1" ?>
<ui:composition xmlns:jsp="http://java.sun.com/JSP/Page"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:ui="http://java.sun.com/jsf/facelets">

<f:view>
<h:head></h:head>
<h:body>
<h:form id="form">
<rich😛anel style="width:400px">
<rich:extendedDataTable selectionMode="multiple" id="freie"
value="#{mitarbeiterZuteilenBean.currentFreieMitarbeiterList}"
var="mitarbeiter">
<f:facet name="header">
<h😱utputText value="Nicht eingeteilte MA" />
</f:facet>

<rich:column sortBy="#{mitarbeiter.vorname}"
filterBy="#{mitarbeiter.vorname}" filterEvent="keyup">
<f:facet name="header">
<h😱utputText value="Vorname" />
</f:facet>
<h😱utputText value="#{mitarbeiter.vorname}" />
<rich:dragIndicator id="indicator1">
<h😱utputText value="#{mitarbeiter.name}" />
</rich:dragIndicator>
<rich:dragSource type="mitarbeiter" dragValue="#{mitarbeiter}"
dragIndicator="indicator1" />
</rich:column>

<rich:column sortBy="#{mitarbeiter.nachname}"
filterBy="#{mitarbeiter.nachname}" filterEvent="keyup">
<f:facet name="header">
<h😱utputText value="Nachname" />
</f:facet>
<h😱utputText value="#{mitarbeiter.nachname}" />
<rich:dragIndicator id="indicator2">
<h😱utputText value="#{mitarbeiter.name}" />
</rich:dragIndicator>
<rich:dragSource type="mitarbeiter" dragValue="#{mitarbeiter}"
dragIndicator="indicator2" />
</rich:column>

<f:facet name="footer">
<rich:dataScroller id="ds" renderIfSinglePage="false" />
</f:facet>
</rich:extendedDataTable>
</rich😛anel>
</h:form>
</h:body>
</f:view>
</ui:composition>[/XML]

 

[Sym]

Ich weiß, dass dieses Feature mit einer 4er Version von RF versprochen wurde. Ich weiß aber nicht, ob dies schon mit 4.1 umgesetzt wurde. Mit 4.0 war das nicht der Fall.

Heute ist 4.2 Release Day bei JBoss Richfaces. Vielleicht schaust Du da mal rein (wenn es da ist). Ansonsten kann es sein, dass das aktuell noch nicht möglich ist. Du kannst natürlich die Breiten der Spalten manuell setzen, aber dann hast Du das Problem eben, wenn der Nutzer seine Browsergröße ändert.

 

[gizmo]

Hallo Sym,

danke für deine Antwort. RF 4.2 ist leider keine Option. Die Tabelle muss ihre Grösse nicht ändern können. Wie erreiche ich eine fixe Spaltenbreite?

_____________
Gizmo

 

[jwiesmann]

geht [XML] <rich:extendedDataTable style="width: 100%;" />[/XML]
nicht?

 

[gizmo]

Klappt leider nicht, es sei denn, ich hätte dich falsch verstanden... Die einzige Veränderung (siehe Screenshot), die ich hinkriege passiert mit folgenden Code:

[XML]<?xml version="1.0" encoding="ISO-8859-1" ?>
<ui:composition xmlns:jsp="http://java.sun.com/JSP/Page"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:ui="http://java.sun.com/jsf/facelets">

<f:view>
<h:head></h:head>
<h:body>
<h:form id="form">
<rich😛anel style="width:400px">
<rich:extendedDataTable selectionMode="multiple" id="freie"
value="#{mitarbeiterZuteilenBean.currentFreieMitarbeiterList}"
var="mitarbeiter">
<f:facet name="header">
<h😱utputText value="Nicht eingeteilte MA" />
</f:facet>

<rich:column sortBy="#{mitarbeiter.vorname}" style="width: 120px;"
filterBy="#{mitarbeiter.vorname}" filterEvent="keyup">
<f:facet name="header">
<h😱utputText value="Vorname" />
</f:facet>
<h😱utputText value="#{mitarbeiter.vorname}" />
<rich:dragIndicator id="indicator1">
<h😱utputText value="#{mitarbeiter.name}" />
</rich:dragIndicator>
<rich:dragSource type="mitarbeiter" dragValue="#{mitarbeiter}"
dragIndicator="indicator1" />
</rich:column>

<rich:column sortBy="#{mitarbeiter.nachname}" style="width: 120px;"
filterBy="#{mitarbeiter.nachname}" filterEvent="keyup">
<f:facet name="header">
<h😱utputText value="Nachname" />
</f:facet>
<h😱utputText value="#{mitarbeiter.nachname}" />
<rich:dragIndicator id="indicator2">
<h😱utputText value="#{mitarbeiter.name}" />
</rich:dragIndicator>
<rich:dragSource type="mitarbeiter" dragValue="#{mitarbeiter}"
dragIndicator="indicator2" />
</rich:column>

<f:facet name="footer">
<rich:dataScroller id="ds" renderIfSinglePage="false" />
</f:facet>
</rich:extendedDataTable>
</rich😛anel>
</h:form>
</h:body>
</f:view>
</ui:composition>[/XML]

 

[gizmo]

Ich habe leider bisher noch keine optimale Lösung gefunden, mit folgendem CSS klappt es aber einigermassen:

.rf-edt-tbl {
	width: 100%;
}

.rf-edt-tbl tr td {
	width: 50%;
}

.rf-edt-tbl tr td div {
	width: auto;
}