Form: input type="file" disabilitate e correlate

**Felino** · 22-08-2008, 15:23

Ciao ragazzi,
vorrei risolvere un probleme...
Ho 4 input type="file" all'interno di un form, mi servono per effettuare l'upload di 4 immagini.
Vorrei che l'utente inserisca le immagini seguento l'ordine della select e quindi...tengo attivata la prima e disattivare le altre tre...dopo che ho selezionato il file per la prima casella si attiva la seconda...e così via...

Che mi suggerite di fare? C'è qualche script che permette di far ciò o qualche soluzione?

**fcaldera** · 22-08-2008, 15:31

Originariamente inviato da Felino
Vorrei che l'utente inserisca le immagini seguento l'ordine della select e quindi...tengo attivata la prima e disattivare le altre tre...dopo che ho selezionato il file per la prima casella si attiva la seconda...e così via...

Che mi suggerite di fare? C'è qualche script che permette di far ciò o qualche soluzione?

Come interagiscono queste select con i campi di upload? Qual è la logica di funzionamento della pagina?

Stai parlando di codice che non vediamo: posta un link e spiega il problema in dettaglio

**Felino** · 22-08-2008, 15:35

Originariamente inviato da fcaldera
Come interagiscono queste select con i campi di upload? Qual è la logica di funzionamento della pagina?

Stai parlando di codice che non vediamo: posta un link e spiega il problema in dettaglio

Si tratta di select per l'upload di file presenti nel pc dell'utente stesso...non appena nella prima select viene selezionato un file...si rende attiva la seconda...e così via per un totale di 4!
La pagina funge da un semplice form per caricare le 4 foto e vari dati...

L'upload e' già funzionante, solo che vorrei far questo controllo sulle select...

codice:

		<td>Foto n.1</td>
	  <td><input type="file" name="image" size="29"/></td>
	</tr>
	<tr align="left">
		<td>Foto n.2</td>
	  <td><input type="file" name="image1" size="29" disabled="disabled" /></td>
	</tr>
	<tr align="left">
		<td>Foto n.3</td>
	  <td><input type="file" name="image2" size="29" disabled="disabled" /></td>
	</tr>
	<tr align="left">
		<td>Foto n.4</td>
	  <td><input type="file" name="image3" size="29" disabled="disabled" /></td>
	</tr>

**fcaldera** · 22-08-2008, 15:41

non esistono 'select per l'upload'

questa è una select:

codice:

<select>
   <option>...</option>
   <option>...</option>
   <option>...</option>
   ...
</select>

tu vuoi che ogni volta che qualcuno sceglie un file dal campo di input, si visualizzi il campo input file successivo fino ad un massimo di 4, giusto? (Un po' come succede in gmail, per gli allegati?)

**Felino** · 22-08-2008, 15:43

So che sono select, ma bensì delle caselle di input ma i tipo file che permetto di prendere il percorso di un file selezionato sul proprio pc..

**fcaldera** · 22-08-2008, 16:02

copia e incolla questo esempio

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="it" xml:lang="it">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>xhtml 1.0</title>
        
        <style type="text/css">
        #uploadfields input          { display     : none; }
        #uploadfields input.visible  { display     : block; margin: 5px 0 0 0; }
        </style>
        
        <script type="text/javascript">
        // <![CDATA[
        window.onload = function() {
        
            var _uf = document.getElementById('uploadfields')
            var _uinp = _uf.getElementsByTagName('input');
            var _ulength =  _uinp.length;
            
            while (_ulength--) {
                _uinp[_ulength].onchange = (function(i) {
                    return function() {
                        if (i < 4) {
                            nextid = 'file'+ (i+1);
                            document.getElementById(nextid).className = 'visible';
                        }
                    }
                })(_ulength);
            }
            
        
        }
        // ]]>
        </script>
    </head>

<body>
<form>

    <fieldset id="uploadfields">
        <input type="file" name="file0" id="file0" class="visible" />
        <input type="file" name="file1" id="file1" />
        <input type="file" name="file2" id="file2" />
        <input type="file" name="file3" id="file3" />
    </fieldset>
</form>


</body>
</html>

**Felino** · 22-08-2008, 16:06

Beh..che dirti...grazie davvero! E' più di quello che cercavo!

Discussione: Form: input type="file" disabilitate e correlate

Strumenti discussione

Ricerca discussione

Visualizza

Form: input type="file" disabilitate e correlate

Re: Form: input type="file" disabilitate e correlate

Re: Re: Form: input type="file" disabilitate e correlate

Permessi di invio