[PrimeFaces] Affichage des composants

**Issamoo** · 12/02/2014, 23h13

Bonjour,
je travail sue crud d'un user
le problème c'est l'affichage des znne de texte et des label
il les affiche trop grand j'utilise pas de css ni de js
est ce que vous pouvez me donné une solution pour que il s'affiche normal ou petit
voici le code de jsf 2 avec prime face

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
80
81
82
<!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:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">
 
<ui:composition template="../common/layout.xhtml">
	<ui:define name="contenu">
		<h:head>
			<title>#{msg['listUser.page']}</title>
		</h:head>
 
		<p:growl id="messages" />
<h:form>
	<p:panel header="Validate">  
        <p:messages autoUpdate="true"/>  
 
        <h:panelGrid id="grid" columns="4" cellpadding="5">  
            <h:outputLabel for="name" value="Name:" style="font-weight:bold"/>                      
            <p:inputText id="name" value="" required="true" label="Name"/>  
            <p:message for="name" />  
            <h:outputText value="" />  
 
            <h:outputLabel for="number" value="Number:" style="font-weight:bold"/>                      
            <p:inputText id="number" value="" label="Number">  
                <f:validateDoubleRange minimum="5" maximum="8" />  
            </p:inputText>  
            <p:message for="number" />  
            <h:outputText value="" />  
 
            <h:outputLabel for="dd" value="Double:" style="font-weight:bold"/>                      
            <p:inputText id="dd" value="" converterMessage="Cannot convert to double.">  
                <f:validateDoubleRange minimum="5.5" maximum="8.5" />  
            </p:inputText>  
            <p:message for="dd" />  
            <h:outputText value="" />  
 
            <h:outputLabel for="money" value="Currency ($):" style="font-weight:bold"/>                     
            <p:inputText id="money" value="" label="Currency">  
                <f:convertNumber type="currency" currencySymbol="$"/>  
            </p:inputText>  
            <p:message for="money" />  
            <h:outputText value="">  
                <f:convertNumber  type="currency" currencySymbol="$" />  
            </h:outputText>  
 
            <h:outputLabel for="regex" value="Regex (^[a-zA-Z]+$):" style="font-weight:bold"/>                      
            <p:inputText id="regex" value="" validatorMessage="Value does not match pattern.">  
                <f:validateRegex pattern="^[a-zA-Z]+$" />  
            </p:inputText>  
            <p:message for="regex" />  
            <h:outputText value="" />  
 
            <h:outputLabel for="date" value="Date" style="font-weight:bold"/>                   
            <p:inputText id="date" value="" label="Date">  
                <f:convertDateTime pattern="MM/dd/yyyy" />  
            </p:inputText>  
            <p:message for="date" />  
            <h:outputText value="">  
                <f:convertDateTime pattern="MM/dd/yyyy" />  
            </h:outputText>  
 
            <h:outputLabel for="desc" value="Description" style="font-weight:bold"/>  
            <p:inputTextarea id="desc" value="" required="true" label="Description">  
                <f:validateLength minimum="3" maximum="10" />   
            </p:inputTextarea>  
            <p:message for="desc" />  
            <h:outputText value="" />  
        </h:panelGrid>  
 
        <p:commandButton value="Non-Ajax" ajax="false" icon="ui-icon-check" validateClient="true" style="margin-right:10px"/>  
        <p:commandButton value="Ajax" update="grid" icon="ui-icon-check" validateClient="true" style="margin-right:10px"/>  
        <p:commandButton value="Partial" update="grid" process="name number" icon="ui-icon-check" validateClient="true" style="margin-right:10px"/>  
        <p:commandButton value="Disabled" ajax="false" icon="ui-icon-check" />  
    </p:panel>  
</h:form>  
 
 
	</ui:define>
</ui:composition>
</html>

**Mishulyna** · 12/02/2014, 23h46

Bonjour,

style="font-weight:bold" c'est du CSS, essaie d'abord d'éliminer ça. Si le résultat ne te convient pas, remplacer par:

style="font-size: 11px" pour les labels et
style="font-size: 11px !important" pour les p:inputText.

Si l'application comporte beaucoup de pages, le plus facile serait de créer une feuille de style CSS pour ne pas avoir à taper (ou copier / coller) ça des centaines de fois.

**Issamoo** · 16/02/2014, 15h16

Merci

[PrimeFaces] Affichage des composants

Servlets/JSP Java

Vue hybride

Discussions similaires

Partager

Partager