Yahya

I have a form that has 2 dropdown lists (Diplomas, Fields), a submit button and an "Add" button that copies the selected values of the dropdownlists to some dynamically generated textboxes as long as the number of the textboxes is lower than 5 This is the code of the dipSecSelection.php file included inside the form: <!----------- The dipSecSelection File -------------> <div id="dipSecSelection"> <table> <tr> <td><label for="diplomes">Diplome:</label></td> <td> <select name="Diplomes" id="Diplomes"> <option value="na">--Diplome--</option> <option value="Technician">Technician</option> <option value="Master">Master</option> <option value="PhD">PhD</option> </select> </td> <td id="separator">|</td><!-- Separator --> <td><label for="secteurs">Secteur:</label></td> <td> <select name="Secteurs" id="Secteurs"> <option value="na">--Secteur--</option> <option value="Software Dev">Software Dev</option> <option value="Engineering">Engineering</option> <option value="Physics">Physics</option> </select> </td> <td> <a href="#" Onclick="addDipSec()" value="Add" class="button">Add</a> </td> </tr> </table> <table> <tr> <td><div id='DipTextBoxesGroup'></div></td> <td><div id='SecTextBoxesGroup'></div></td> </tr> </table> </div> <script type="text/javascript"> //Diplomas textBoxes!!! var counterdip = 1; var countersec = 1; function addDipSec(){ if(counter>5){ alert("Only 5 Diplomas allow"); return false; } var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + counterdip); newTextBoxDiv.after().html('<label>Diplome #'+ counterdip + ' : </label>' + '<input type="text" name="dipBox[]" id="textboxdip' + counterdip + '" value="" >'); newTextBoxDiv.appendTo("#DipTextBoxesGroup"); $('#textboxdip'+counterdip).val($('#Diplomes option:selected').html()); counter++; //Secteurs textBoxes if(countersec>5){ alert("Only 5 Setors are allowed"); return false; } var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + countersec); newTextBoxDiv.after().html('<label>Secteur #'+ countersec + ' : </label>' + '<input type="text" name="secBox[]" id="textboxsec' + countersec + '" value="" size="35">'); newTextBoxDiv.appendTo("#SecTextBoxesGroup"); $('#textboxsec'+countersec).val($('#Secteurs option:selected').html()); countersec++; alert(secBox[0].val); } </script> This is the php code: <form action="<?php echo $_SERVER['REQUEST_URI']; ?>" method="POST" enctype="multipart/form-data"> <?php include'includes/dipSecSelection.php'?> <?php if(isset($_POST['dipBox']) && isset($_POST['secBox'])){ if(!empty($_POST['dipBox'])&&!empty($_POST['secBox'])){ $dip= $_POST['dipBox']; $sec= $_POST['secBox']; $N = count($dip); for($i=0; $i < $N; $i++){ $add_AnnDipSec = "INSERT INTO annDipSec VALUES('$dip[$i]','$sec[$i]')"; if(mysqli_query($connection, $add_AnnDipSec)){ echo'Successfully Added to AnnDipSec'; }else{echo'Error while trying to insert into AnnDipSec';} } }else{echo"Dip and Sec were Empty";} } ?> <input type="submit" name="submit" value="Submit" class='button'> </form> Problem is that dipBox[] and secBox[] never get set and always return nothing so they never get inserted to the database table.