2016-07-28 7 views
1

Ich versuche, FileUpload mit erweiterten Modus und Ajax-Funktion anzuzeigen, aber ich möchte es aussehen wie einfachen Modus, die nur Schaltfläche mit Label-Namen anzeigen, dies mein FaceletMake p: fileUpload erweiterten Modus erscheint wie einfachen Modus

<p:fileUpload fileUploadListener="#{scriptManagerForm.uploadSourceFile}" auto="true" 
            skinSimple="true"> 
         <f:attribute name="name" value="#{sourcefile.name}" /> 
    </p:fileUpload> 

mit diesem css

.fileupload-content{ 
       display: none; 
      } 
      .ui-fileupload .fileinput-button { 
       background-color: rgba(142, 103, 64, 0.98); 
      } 

Ihnen danken,

+1

Post einige Code, ich hoffe, dass Sie sehen, was in 'Primefaces' erfolgt vor frage diese frage –

+0

ja, ich habe primefaces doc gesehen, ich werde den post aktualisieren, um etwas code hinzuzufügen. – mustafa918

Antwort

0

nicht sicher, warum Sie dies tun wollen würde, aber von einem CSS p erspective der Code ist unten:

/*Hide the advanced buttons and progress*/ 
.ui-fileupload-upload, .ui-fileupload-cancel, .ui-fileupload-progress{ 
    display: none; 
} 

/*Move the file name and size of file onto same line*/ 
.ui-fileupload-buttonbar, .ui-fileupload-content{ 
    float: left; 
} 

/*Remove some of the margin from the file name to align correctly*/ 
.ui-fileupload-files{ 
    margin: 0; 
} 

Original-

Before

Nach CSS

After

+0

Ich habe das noch nicht getestet, aber das erscheint sehr gut danke, – mustafa918