Campo HTML input file con jQuery

Gian72Luca

Nuovo Utente
20 Mar 2019
4
0
1
Buona sera, avrei la necessità di "abbellire" il tasto selezione file di default di html.

Ho trovato una soluzione funzionale ma poco elegante utilizzando semplicemente il CSS, poichè difficilmente gestibile su diversi formati di visualizzazione.

Ho cercato altre soluzione e ne ho trovata una, proprio su questo sito, interessante e all'apparenza semplice, ma nella realtà non così semplice.
La soluzione prevede l'utilizzo di jQuery e CSS

Premetto che non so nulla di jQuery e da qui nascono i miei problemi.

Il codice è il seguente.

html / JQuery

HTML:
<body>
    <div>
        <form enctype="multipart/form-data" action="update_power_exp.php?typeimport=gsm-u900" method"=post">
            <input type="file" id="upload" />
             <input type="button" value="Seleziona file" id="btn"/>
             <button class="button" id="update" type="submit">Carica</button>
         </form>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    <script>   
        $('#btn').click(function(){
            $('#upload').click();
         });   
    </script>
</body>
CSS:

HTML:
input#upload {
  display: block;
  visibility: hidden;
  width: 0;
  height: 0;
}
Il mio problema è semplice, non funziona.

Ho i due tasti, "Seleziona file" e "Carica", se clicco sul primo non succede nulla e se clicco sul secondo mi invia nella sezione upload il nulla.

Sicuramente il problema risiede nella parte a me oscura di jQuery, qualcuno potrebbe darmi un mano?

Grazie