• User

    [Ajax-php-mysql] tasto che crea div

    Ciao a tutti, si nuovo qui. Sono alle prese con un problemino, premetto che sto imparando ora cosa sia javascript per poter poi passare ad ajax, ma sono poco oltre i primi rudimenti... Vi scrivo perchè ho creato un form in cui il numero di volte che sarà possibile inserire quei dati potrà variare in base alle esigenze contingenti. In pratica ho messo un tasto "aggiungi" che vorrei creasse un nuovo div contenente vari campi di inserimento. Per fare un esempio: un form in cui posso inserire nel db tutte le mie automobili e di ogni automobile io inserisco il modello, la casa e il numero di targa. Sciacciando il tasto aggiungi vorrei mi ricomparisse sotto una nuova riga che ripresenti i campi su citati. Il problema è che alcuni di questi campi sono delle select che recuperano i valori da un DB attraverso il php. io per ora riesco a far apparirire una nuova riga in un div, ma se tento di inserire tutti i campi imput che mi servono non funziona nulla... Se qualcuno può darmi una dritta su dove sbaglio... Vi posto il codice.

    
    <form id="cat" method="post" action="<?php echo $actionForm; ?>" enctype="multipart/form-data">
    <div class="categoria">
                <?php
                if($row['dtFin'] == '0000-00-00')
                {
                ?>
                    <input type="text" value="<?php echo recData($row['dtIn']); ?>" disabled="true" style="width:110px; float:left; margin:0 5px" />
                  <?php
                  }
                  else
                {
                ?>    
                    <select id="select" name="data" title="Data" style="width:110px; float:left; margin:0 5px">
                        <option value="">Data</option>
                           <?php
                           $arrayDt = calcolaDate($row['dtIn'],$row['dtFin']);
        
                        foreach($arrayDt as $data)
                        {
                        ?>
                            <option value="<?php echo $data;?>" <?php if(isset($_POST['data']) && $_POST['data'] == $data){echo "selected";}?>><?php echo $data; ?></option>
                         <?php
                         }
                         ?>
                    </select>
                    <?php
                    if(isset($errori['data'])){echo $errori['data'];}
                 }
                  ?>
                    
                    <select id="select" name="cat" style="width:160px; float:left; margin:0 5px">
                        <option value="">Categoria</option>
                        <?php
                        $query_ct = "SELECT * FROM cat WHERE nz_ID = '1' OR nz_ID = '0'";
                        $result_ct = mysql_query($query_ct,$db) or die(mysql_error($db));
                        while($r_ct = mysql_fetch_array($result_ct))
                        {
                        ?>
                            <option value="<?php echo $r_ct['ID_ct'];?>" <?php if(isset($_POST['cat']) && $_POST['cat'] == $r_ct['cat']){echo "selected";}?>><?php echo $r_ct['cat']; ?></option>
                        <?php
                        }
                        ?>
                    </select>
                <?php
                if(isset($errori['cat'])){echo $errori['cat'];}
                  ?>
                    <select id="select" name="val" style="width:190px; float:left; margin:0 5px">
                        <option value="">Validità</option>
                        <?php
                        $query_vl = "SELECT * FROM val WHERE nz_ID = '1' OR nz_ID = '0'";
                        $result_vl = mysql_query($query_vl,$db) or die(mysql_error($db));
                        while($r_vl = mysql_fetch_array($result_vl))
                        {
                        ?>
                            <option value="<?php echo $r_vl['ID_vl'];?>" <?php if(isset($_POST['val']) && $_POST['val'] == $r_vl['val']){echo "selected";}?>><?php echo gestCSp($r_vl['val']); ?></option>
                        <?php
                        }
                        ?>
                    </select>
                <?php
                if(isset($errori['val'])){echo $errori['val'];}
                  ?>
                <div style="float:left; margin:0 5px">N° Iscr: </div>
                <input type="text" name="isc" style="float:left;width:30px; margin:0 5px" value="<?php echo $_POST['isc']; ?>"/><?php if(isset($errori['isc'])){echo $errori['isc'];} ?>
                <div style="float:left; margin:0 5px">N° Elim: </div>
                <input type="text" name="elm" style="float:left;width:30px; margin:0 5px"  value="<?php echo $_POST['elm']; ?>" /><?php if(isset($errori['elm'])){echo $errori['elm'];} ?>
                    
                <p style="float:left; width:20px; margin:3px 0 0 0; padding:0"><a href="#" id="aggiungi" title="Aggiungi una nuova Categoria" ><img src="images/comuni/add.gif" width="17" height="16" alt="Aggiungi Riga" /></a></p>
                  <p style="float:left; width:20px; margin:3px 0 0 0; padding:0"><a href="#" id="togli" title="Elimina una Categoria" ><img src="images/comuni/elimina.gif" width="17" height="16" alt="Elimina Riga" /></a></p>
    </div>
    </form>
    
    

    e lo script js che ho creato per far creare e togliere il div

    
    var GestoreCategorie = 
    {
        init: function()
        {
            form = document.getElementById("cat");
            var elemento = document.getElementById("aggiungi");
            Core.addEventListener(elemento,"click",GestoreCategorie.aggiungi);
            
            var elemento = document.getElementById("togli");
            Core.addEventListener(elemento,"click",GestoreCategorie.togli);
        },
        
        aggiungi: function(evento)
        {
            var contTesto = "prova aggiunta nuova categoria";
            var testo = document.createTextNode(contTesto);
            var p = document.createElement("P");
            var divNew = document.createElement("DIV");
            p.appendChild(testo);
            divNew.appendChild(p);
            form.appendChild(divNew);
            
            form._lastDiv = divNew;
            
            Core.preventDefault(evento);
        },
        
        togli: function(evento)
        {
            var divFigli = form.childNodes;
            
            if(divFigli.length > 1)
            {
                form.removeChild(form.lastChild);
            
                Core.preventDefault(evento);
            }
        }
    };
    
    Core.start(GestoreCategorie);
    
    

    il codice qui sopra mi serviva solo per vedere se micreava il div e me lo toglieva...ora ho provato a mettere il contenuto del div in contTesto ma non funziona più nulla... dove sbaglio? o meglio cosa ancora non so che potrebbe far funzionare il tutto? Grazie a tutti spero mi possiate dare qualche dritta...


  • User

    Ho risolto, scoprendo la funzione cloneNode tutto è andato a posto stranne un problemino che è rimasto ma che sottoporrò in un altro post dedicato...grazie a tutti lo stesso ciao e alla prossima.