Discussion :

[FunkyBreizh]

Bonjour,

J'ai regardé beaucoup de topics et impossible de trouver la solution appropriée.

J'ai un rich:dataTable et j'aimerai pouvoir modifier la taille des colonne et la hauteur des lignes. En effet j'ai un tableau avec des actions de ce type:

http://livedemo.exadel.com/richfaces...ble&cid=569672

et mes icônes dans la colonne Actions ne sont pas aligné mais positionné les uns en dessous des autres. Ce qui donne des lignes avec une grande hauteur.

De plus j'essaye de mettre des css dans des feuilles de style a part, et la aussi, c'est impossible. Mes pages sont en xHTML, pas en JSP.

Merci,

[Sniper37]

ça dépend du width donné à la table, et celui donnée aux colonnes,
tu peux rencontrer ce problème avec n'importe quelle table html.

[FunkyBreizh]

Bah justement, je ne donne pas de width, je voudrai faire tous cas dans les css

[Sniper37]

un exemple de ce que tu fais?

[FunkyBreizh]

Voila, c'est un tableau tous con, avec des icones dans la dernière colonnes, pour pouvoir éditer, supprimer des lignes.

Maintenant, j'aimerai avoir une feuille de style (a part) et la dedans pouvoir configurer la hauteur de mes ligne, la largeur de mes colonnes. Je ne veux pas le faire dans mon xHTML pour des raisons de lisibilités.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
 
	<rich:dataTable id="usersDataTable" rowKeyVar="row"
		value="#{usersDataTableBean.usersList}" var="user"
		onRowMouseOver="this.style.backgroundColor='#F1F1F1'"
		onRowMouseOut="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'">
		<f:facet name="header">
			<rich:columnGroup>
				<rich:column>
					<h:outputText styleClass="headerText" value="#{msg.login}" />
				</rich:column>
				<rich:column>
					<h:outputText styleClass="headerText" value="#{msg.firstname}" />
				</rich:column>
				<rich:column>
					<h:outputText styleClass="headerText" value="#{msg.lastname}" />
				</rich:column>
				<rich:column>
					<h:outputText styleClass="headerText" value="#{msg.mail}" />
				</rich:column>
				<rich:column>
					<h:outputText styleClass="headerText" value="#{msg.phone}" />
				</rich:column>
				<rich:column>
					<h:outputText styleClass="headerText"
						value="#{msg.remainTime} (en mn)" />
				</rich:column>
				<rich:column />
			</rich:columnGroup>
		</f:facet>
 
		<rich:column filterBy="#{user.login}" filterEvent="onkeyup">
			<h:outputText value="#{user.login}" />
			<f:facet name="footer">
				<h:outputText value="Total" />
			</f:facet>
		</rich:column>
		<rich:column filterBy="#{user.usersDatas.lastname}"
			filterEvent="onkeyup">
			<h:outputText value="#{user.usersDatas.lastname}" />
		</rich:column>
		<rich:column filterBy="#{user.usersDatas.firstname}"
			filterEvent="onkeyup">
			<h:outputText value="#{user.usersDatas.firstname}" />
		</rich:column>
		<rich:column filterBy="#{user.usersDatas.mail}" filterEvent="onkeyup">
			<h:outputText value="#{user.usersDatas.mail}" />
		</rich:column>
		<rich:column filterBy="#{user.usersDatas.phone}" filterEvent="onkeyup">
			<h:outputText value="#{user.usersDatas.phone}" />
		</rich:column>
		<rich:column>
			<h:outputText value="#{user.usersDatas.remainTime}" />
			<f:facet name="footer">
				<h:outputText id="totalTimeOutput"
					value="#{usersDataTableBean.totalTime}" />
			</f:facet>
		</rich:column>
		<rich:column>
			<a4j:commandLink ajaxSingle="true" id="historyLink"
				reRender="historyTable"
				oncomplete="Richfaces.showModalPanel('historyPanel');">
				<h:graphicImage value="/pages/images/passed.gif" style="border:0" />
				<f:setPropertyActionListener value="#{user}"
					target="#{historyDataTableBean.user}" />
			</a4j:commandLink>
			<a4j:commandLink ajaxSingle="true" id="editUserLink"
				oncomplete="Richfaces.showModalPanel('editUserPanel');"
				reRender="userInputForm">
				<h:graphicImage value="/pages/images/edit.gif" style="border:0" />
				<f:setPropertyActionListener value="#{user}"
					target="#{usersFormBean.editUser}" />
			</a4j:commandLink>
			<a4j:commandLink ajaxSingle="true" id="deleteUserLink"
				reRender="usersDataTable, creditTable, requestsTable"
				action="#{usersDataTableBean.deleteUser}">
				<h:graphicImage value="/pages/images/delete.gif" style="border:0" />
			</a4j:commandLink>
		</rich:column>
	</rich:dataTable>

[FunkyBreizh]

Pour montrer un autre problème que je peux avoir :

Ci-dessous j'ai une grille, dans la troisième colonne doit s'afficher les messages d'erreurs quand le formulaire n'est pas bien rempli. Le problème c'est que le texte s'affiche mais les mots sont les un en dessous des autres. Moi je voudrai que mon modalPanel dans lequel ce situe le formulaire, s'agrandisse horizontalement et ke le message soit sur une ligne. J'ai essayer de bloquer la hauteur des lignes du Grid, mais ça ne fait rien.
J'ai vraiment du mal avec les CSS...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
<style>
.row { heigth:20px;
}
</style>
	<h:form id="packInputForm">
		<h:panelGrid columns="3" rowClasses="row">
			<h:outputText value="#{msg.id_pack} : " />
			<h:inputText id="idInput" value="#{packsFormBean.editPack.id}">
				<rich:beanValidator summary="Invalid id" />
				<rich:ajaxValidator event="onblur" />
			</h:inputText>
			<rich:message for="idInput" />
 
			<h:outputText value="#{msg.pack_entitle} : " />
			<h:inputTextarea id="entitleInput"
				value="#{packsFormBean.editPack.entitle}">
				<rich:beanValidator summary="Invalid entitle" />
				<rich:ajaxValidator event="onblur" />
			</h:inputTextarea>
			<rich:message for="entitleInput" />
 
			<h:outputText value="#{msg.price} : " />
			<h:inputText id="priceInput" value="#{packsFormBean.editPack.price}">
				<rich:beanValidator summary="Invalid price" />
				<rich:ajaxValidator event="onblur" />
			</h:inputText>
			<rich:message for="priceInput" />
 
			<h:outputText value="#{msg.length} : " />
			<h:inputText id="lengthInput"
				value="#{packsFormBean.editPack.length}">
				<rich:beanValidator summary="Invalid length" />
				<rich:ajaxValidator event="onblur" />
			</h:inputText>
			<rich:message for="lengthInput" />
		</h:panelGrid>
		<a4j:commandButton action="#{packsFormBean.addPack}" value="Valider" 
			reRender="packsTable" />
	</h:form>