Visualizzazione risultati 1 fino 3 di 3

Discussione: Problema semplice script per aggiungere un campo input

  1. #1
    Guest

    Predefinito Problema semplice script per aggiungere un campo input

    Salve a tutti! Ho scritto un semplicissimo script, in pratica si hanno due campi input di base, al quale l'utente (tramite il tasto "aggiungi") può aggiungerne altri a piacimento. Lo script funziona, tuttavia se io compilo con dei valori i campi, e poi vado ad aggiungere un nuovo campo con l'apposito tasto, vengono resettati anche i campi già compilati.
    Codice HTML:
    <html>
    
    <head>
       <script>
    
       var n_campi=2;
       
       function Aggiungi(){
        n_campi++;
        document.getElementById("campi").innerHTML = document.getElementById("campi").innerHTML + "<input type=\"text\" name=\"campo"+n_campi+"\" id=\"campo"+n_campi+"\" value=\"0\"/><br>";
       }
    
       </script>
    </head>
    
    
    <body>
    
    <div id="campi">
    <input type="text" name="campo1" id="campo1" value="0"/><br>
    <input type="text" name="campo2" id="campo2" value="0"/><br>
    </div>
    
    <input type="button" value="Aggiungi" onclick="Aggiungi();"/>
    
    </body>
    
    </html>
    Quello che non capisco è perchè si resettano i campi, in pratica con la funzione Aggiungi() gli dico di scrivere nel div che contiene i campi, i campi già presenti + quello nuovo. Qualcuno mi sa spiegare dove sbaglio? Spero di essere stato chiaro

  2. #2
    Guest

    Predefinito

    Prova a modificare la funzione Aggiungi così

    Codice:
    function Aggiungi () {
      n_campi++;
      var input = document.createElement ("input");
      input.setAttribute ("type", "text");
      input.setAttribure ("name", "campo" + n_campi);
      input.setAttribure ("id, "campo" + n_campi);
      input.setAttribure ("value", "0");
      document.getElementById ("campi").appendChild (input);
    }
    In pratica anzi che riscrivere tutti gli input ne aggiungi uno al fondo. ..
    Ultima modifica di tampertools : 02-02-2014 alle ore 16.35.22

  3. #3
    Data registrazione
    15-04-2012
    Messaggi
    4

    Predefinito

    Prova così

    <html>
    <head>
    <script>
    var n_campi=2;
    function Aggiungi()
    {
    n_campi++;
    var para=document.createElement("input");
    para.setAttribute("type", "text");
    para.setAttribute("name", "campo"+n_campi);
    para.setAttribute("value", 0);
    var element=document.getElementById("campi");
    element.appendChild(para);
    var para=document.createElement("br");
    var element=document.getElementById("campi");
    element.appendChild(para);
    }
    </script>
    </head>

    <body>
    <div id="campi">
    <input type="text" name="campo1" id="campo1" value="0"/><br>
    <input type="text" name="campo2" id="campo2" value="0"/><br>
    </div>
    <input type="button" value="Aggiungi" onclick="Aggiungi();"/>
    </body>
    </html>

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •