wie zu entfernen hochladen die Schaltfläche Abbrechen <p:fileUpload>

In meiner JSF-2.0 - Primefaces-Anwendung, die ich verwende, will ich NICHT haben

  1. Fortschrittsbalken
  2. auf die Schaltfläche upload,
  3. Schaltfläche Abbrechen
    das zeigt sich neben dem ausgewählten Bild(wenn das Bild ausgewählt ist)

Weiteres Problem ist die 'fileLimit' ich will es auf 1 festlegen, aber wenn ich das mache, was er sagt ungültiges Attribut.

Hier ist mein code:

<p:fileUpload id="related_image" fileUploadListener="#{fileUploadController.handleFileUpload}"  
        mode="advance"  
        auto="false" 
        showButtons="false"
        sizeLimit="100000"
        fileLimit ="1"
        allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
        style="width: 310px"/>
InformationsquelleAutor Abhishek Dhote | 2012-09-29
  1. 2

    Grundsätzlich alles, was Sie tun müssen, ist zu zuweisen, finden Sie heraus, die richtige css Selektoren und Ihnen mit display:none; (steckte Sie in Ihr .css-Datei und schließen Sie Sie mit <h:outputStylesheet)

    im Allgemeinen (in der css, die Sie brauchen, um zu entkommen die Doppelpunkt mit \3a Umgang mit einem Doppelpunkt in eine element-ID in einer CSS-Selektor , während in jquery, die Sie verwenden sollten \\:)

    #some_prefix_id\3a your_file_upload_component_id .someClass{
    display:none;
}

    wo die some_prefix_id vielleicht werden einige Formular-id oder einige benennen
    container-id ,

    oder (manchmal gibt es keine Präfix vor your_file_upload_component_id )

    #your_file_upload_component_id .someClass{
    display:none;
}

    Obwohl , INMO , beste Ansatz wäre das zuweisen eines id zu Ihrer form und mit diesem Selektor in css : 

    #your_form_id .someClass{
    display:none;
}

    Nun zu den genauen Selektoren...

    so zu entfernen das upload-button

    #related_image .start{
    display:none;
}

    oder, wenn Sie wollen, tun Sie das gleiche mit jquery

    $("#related_image .start").hide();

    entfernen der Abbrechen-Schaltfläche, die zeigt sich neben dem ausgewählten Bild(wenn das Bild ausgewählt ist)

    #related_image .cancel{
    display:none;
}

    oder, wenn Sie wollen, tun Sie das gleiche mit jquery

    $("#related_image .cancel").hide();

    entfernen Fortschrittsbalken

    #related_image .progress{
    display:none;
}

    oder, wenn Sie wollen, tun Sie das gleiche mit jquery

    $("#related_image .progress").hide();

    Testen kann man die jquery-Ansatz auf primefaces-showcase-wenn Sie möchten , ersetzen Sie einfach die #related_image mit #j_idt19\\:j_idt20 zum Beispiel $("#j_idt19\\:j_idt20 .start").hide();

    Gibt es kein solches Attribut als fileLimit werfen Sie einen Blick auf die Tag fileUpload

    • was ist der Wert, der styleClass für <p:fileUpload>
    • keinen Wert auf alle... einfach alle css code, den ich oben gepostet, die in Ihrer benutzerdefinierten css-Datei und fügen ihn in Ihre xhtml-Seite , thats all...
    • Wenn ich .Fortschritte{ display:none; } funktioniert es, aber wenn ich #related_image .Fortschritte{ display:none; } das funktioniert nicht, keine Ahnung
    • arbeiten Sie mit Ihrem browser dev tools / firefox, und überprüfen Sie die id des upload-Komponente , die im Schaufenster zum Beispiel, die so etwas wie j_idt19:j_idt20 , das ist die Vorwahl von css-Selektoren...
    • id p:fileupload ist related_image
    • tut #related_image.progress{ display:none; } ohne Leerzeichen funktioniert ? man könnte auch die Zuordnung der id zu einer form, die umschließt die fileupload-Komponente, und versuchen Sie #yourFormID .progress{ display:none; }
    • #yourFormID .Fortschritte{ display:none; } funktioniert tausend Dank Daniel. Wollen einfach nur, um zu überprüfen, ob Sie haben die Antwort für meine zweite Abfrage die 'fileLimit' ich will es auf 1 festlegen, aber wenn ich das mache, was er sagt ungültiges Attribut.
    • Es gibt kein solches Attribut als fileLimit werfen Sie einen Blick auf meine aktualisierte Antwort...
    • sowie primefaces-Benutzerhandbuch 3.3 hat eine erwähnt dass. Kennst du einen anderen Ansatz zu beschränken, um nur 1 Datei darf hochgeladen werden
    • seinen sollte standardmäßig (multiple="false") werfen Sie einen Blick auf die Schaufenster - primefaces.org/showcase/ui/fileUploadSingle.jsf
    • (multiple="false") wird nicht zulassen, dass mehrere Dateien ausgewählt werden für den upload im Datei-dialog in einem Schuss, aber das, was ich will, es p:uploadfile-Komponente sollte nur eine Datei ausgewählt werden für den upload.
    • Haben, als Sie sollten verwenden auto="true"

    InformationsquelleAutor Daniel
Schreibe einen Kommentar