campo file nascosto

**djjunior** · 08-08-2011, 10:52

Carissimi,
utilizzando i div come posso nascondere i campi file?
Mi spiego meglio, devo mettere 10 campi file per caricare altrettante foto.
Ora vorrei che apparissero uno alla volta, ad apertura pagina solo il primo campo file, appena faccio sfoglia e seleziono il file apparisse il 2° e cosi via come posso fare?
Grazie
G.

**djjunior** · 08-08-2011, 12:29

nessuno può aiutarmi?

**0-c00l** · 08-08-2011, 12:50

Al click su alri input file credo non puoi, al click o fai eseguire la funzione dell' input file o la funzione js per far apparire gli altri div.

**djjunior** · 08-08-2011, 12:57

grazie per la tua risposta ma al click sarebbe meglio utilizzare onchange forse...
Comunque ho trovato questo script che potrebbe fare al caso mio ugualmente, anche se non è proprio quello che cercavo.
Ma a questo script c'è un problema, inserisce campi file infiniti, come posso limitare che si aggiungano max solo 10 campi file?
Grazie
G.

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/javascript">
<!--
var files = 1;

function add() {
  if (document.createElement && document.getElementById && document.getElementsByTagName) {
    // crea elementi
    var inputField = document.createElement("input");
    var brField = document.createElement("br");

    // setta attributi
    inputField.setAttribute("type","file");
    inputField.setAttribute("name","file" + files);

    // appendi al relativo padre
    document.getElementById('files').appendChild(brField);
    document.getElementById('files').appendChild(inputField);
    // incrementa variabile globale
    files++;
  }
}

function del() {
  if (document.removeChild && document.getElementById && document.getElementsByTagName) {
    // se non e' la prima riga
    if (files > 1) {
      // decrementa variabile globale
      files--;
      // rimuovi
      var inputField = document.getElementById('files').getElementsByTagName('input')[files];
      var brField = document.getElementById('files').getElementsByTagName('br')[files-1];
      document.getElementById('files').removeChild(inputField);
      document.getElementById('files').removeChild(brField);
    }
  }
}
//-->
</script>
</head>
<body>
<form name="modulo" action="caricaimmagine.asp" method="post" enctype="multipart/form-data">
  <p id="files">
    <input type="file" name="file1" />
  </p>
  

Aggiungi foto <a href="javascript:del()">
	Rimuovi foto</a></p>
  <input name="invio" type="submit" id="invio" value="Upload files">
  <input type="reset" name="Submit2" value="Reimposta">
</form>
</body>
</html>

**0-c00l** · 08-08-2011, 13:32

Ora stiamo entrando in javascript, meglio far spostare la discussione. Comunque prova così invece di quello script:

codice:

<script type="text/javascript">
function aggiungi() {

var lista_Elementi = $('#nuovo').size();
if(lista_Elementi < 10) {
$("<div id='nuovo'><input type='file' name='NOME INPUT' /></div>').appenTo("#files");
} else {
alert('Hai raggiunto il limite massimo di files da caricare.');
}
 }

function rimuovi() {
   $("#nuovo").remove();
 }
</script>
<input type="button" onclick="aggiungi();" value="Aggiungi" /><input type="button" onclick="rimuovi();" value="Rimuovi" />


<div id="files">
<div id="first"><input type="file" name="NOME INPUT" /></div>
</div>

Poi per farlo funzionare bene devi includere anche jquery-1.3.2.js
[/CODE]

**djjunior** · 08-08-2011, 13:51

ciao ma non funziona
vedi qui in esecuzione
Grazie

**0-c00l** · 08-08-2011, 14:04

Ops, ho scritto male appendTo, sorry:

codice:

<script type="text/javascript">
function aggiungi() {

var lista_Elementi = $('#nuovo').size();
if(lista_Elementi < 10) {
$("<div id='nuovo'><input type='file' name='NOME INPUT' /></div>').appendTo("#files");
} else {
alert('Hai raggiunto il limite massimo di files da caricare.');
}
 }

function rimuovi() {
   $("#nuovo").remove();
 }
</script>
<input type="button" onclick="aggiungi();" value="Aggiungi" /><input type="button" onclick="rimuovi();" value="Rimuovi" />


<div id="files">
<div id="first"><input type="file" name="NOME INPUT" /></div>
</div>

**djjunior** · 08-08-2011, 14:18

Purtroppo ancora gli stessi errori java

**djjunior** · 08-08-2011, 15:04

Ho trovato quest'altro script, come si adatta a limitare max 10 campi?
e se cè solo un campo non visualizzare RIMUOVI
Grazie 1000
G.

codice:

<script type="text/javascript">
<!--

var arrInput = new Array(1);
  var arrInputValue = new Array(1);
  
function addInput() {
  //arrInput.push(createInput(arrInput.length));
  arrInput.push(arrInput.length);
  //arrInputValue.push(arrInputValue.length);
  arrInputValue.push("");
  display();
}
function display() {
  document.getElementById('CAMPO').innerHTML="";
  for (intI=0;intI<arrInput.length;intI++) {
    document.getElementById('CAMPO').innerHTML+=createInput(arrInput[intI], arrInputValue[intI]);
  }
}

function saveValue(intId,strValue) {
  arrInputValue[intId]=strValue;
}  

function createInput(id,value) {
  return "<input type='file' size='60' id='file "+ id +"' onChange='javascript:saveValue("+ id +",this.value)' value='"+ value +"'>
";
}
function deleteInput() {
  if (arrInput.length > 1) { 
     arrInput.pop(); 
     arrInputValue.pop();
  }
  display(); 
}

// -->
</script>
</head>
<body >



<form method="get" action="news.asp">
<div align="center"><p id="CAMPO">
<input type="file" name="file1" size="60"/>
</p>
Aggiungi 

Rimuovi

</div>

**djjunior** · 08-08-2011, 16:12

nessun aiuto?

Discussione: campo file nascosto

Strumenti discussione

Ricerca discussione

Visualizza

campo file nascosto

Permessi di invio