Login

01-14-2009, 09:47 AM

[eluser]Unknown[/eluser]
Hallo,
I just made a form with addRow function. (my first form with javascript)
see image
de code

Code:
&lt;?php

require "db.php";

$query= "SELECT * FROM taallessen ORDER BY taalnaam ASC";

$res = mysql_query($query) or die(mysql_error()); 

$lesdata = "";

while ($row = mysql_fetch_row($res)){

if ($lesdata)

$lesdata .= ",";

$lesdata .=  '"'.$row[1].'"';

}

?&gt; 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

&lt;html&gt;

&lt;head&gt;

&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;

&lt;title&gt;Join now&lt;/title&gt;

&lt;link href="main.css" type="text/css" rel="stylesheet"&gt;

&lt;/head&gt;

[removed]

function del_formrow(){

  if (!this.table_formcontainer)

    this.table_formcontainer = document.getElementById("table_formcontainer");

  if (!this.table_formcontainer)

    return;

var table_formcontainer = document.getElementById("table_formcontainer")

if (table_formcontainer.rows.length > 1)

{

  table_formcontainer.deleteRow(table_formcontainer.rows.length-1);

}

 table_formcontainer.deleteRow();

}

function add_formrow(){

  if (!this.table_formcontainer)

    this.table_formcontainer = document.getElementById("table_formcontainer");

  if (!this.table_formcontainer)

    return;

  var new_row = table_formcontainer.insertRow(-1);

  var new_cell1 = new_row.insertCell(0);

  var new_cell2 = new_row.insertCell(1);

  var new_cell3 = new_row.insertCell(2);

  var new_input1 = document.createElement("input");

  new_input1.type = "text";

  new_input1.size = "40";

  new_input1.name = "kidername[]";

  new_cell1.appendChild(new_input1);

  var new_input2 = document.createElement("input");

  new_input2.type = "text";

  new_input2.size = "5";

  new_input2.name = "age[]";

  new_cell2.appendChild(new_input2);

   var new_input3 = document.createElement("select");

   new_input3.name="lesson[]";

   var options = [&lt;?php echo $lesdata; ?&gt;] ;

   for (var i = 0; i < options.length; i++)

   {

    var option = document.createElement("option");

    option.value = options[i];

    option.text= options[i];

    try

    {

      new_input3.add(option, null);

    }

    catch(error)  

    {

      new_input3.add(option);

    }

  }

  new_cell3.appendChild(new_input3);  

  } 

[removed]

&lt;body&gt;

<div id="credit"><b>T e s t</b></div>

<br>

&lt;form name="data" method="post" action="confirmation.php"&gt;

<fieldset> <legend>

<font color="blue"><b>Kid informations</b></font></legend><br>

<table id="table_formcontainer">

    <tr bgcolor="#e5e5e5">

          <td width="200"> Kidname </td> <td width="20"> Age </td> <td width="80"> Lesson </td>            

     </tr>

     <tr>

          <td>&lt;input name="kidname[]" size="40"&gt;&lt;/td> <td>&lt;input name="age[]" size="5"&gt;&lt;/td> 

          <td><select name="lesson[]"><option value="select">select</option><option>Chines</option>

          <option>German</option><option>France</option><option>English</option><option>Italian</option>

          <option>Nederlands</option><option>Spain</option></select></td>            

     </tr>     

</table>

<table>     

     <tr>

              <td width="500" align="right">[<b><a href="#">+</a></b>]</td>

            <td>&nbsp;</td><td>[<b><a href="#">-</a></b>]</td>      

     </tr>

</table>

<br>

<fieldset> <legend>

<font color="blue"><b>Parent informations</b></font></legend><br>

<table>

    <tr>

            <td width="100">Name</td> <td>:</td> <td>&lt;input name="naam" size="50"&gt;&lt;/td>            

    </tr>

    <tr>

            <td width="100">Address</td> <td>:</td> <td>&lt;input name="adres" size="50"&gt;&lt;/td>            

    </tr>

    <tr>

            <td width="100">Zip</td> <td>:</td> <td>&lt;input name="postcode" size="50"&gt;&lt;/td>            

    </tr>

    <tr>

            <td width="100">City</td> <td>:</td> <td>&lt;input name="woonplaats" size="50"&gt;&lt;/td>            

    </tr>

    <tr>

            <td width="100">Phone</td> <td>:</td> <td>&lt;input name="telefoon" size="50"&gt;&lt;/td>            

    </tr>

    <tr>

            <td width="100">Email</td> <td>:</td> <td>&lt;input name="email" size="50"&gt;&lt;/td>            

    </tr>

</table>

<table>    

    <tr>

            <td width="100">&nbsp;</td> <td>&nbsp;</td>

            <td><br>&lt;input type="submit" name="submit" value=" C o n f i r m "&gt;&nbsp;&nbsp;

            &lt;input type="button" value=" R e s e t "&gt;&lt;/td>

    </tr>

</table>

&lt;/form&gt;&lt;/fieldset>        

<br>

&lt;/body&gt;

&lt;/html&gt;

My question is how to send this form using php?
perhaps someone can help me. thanks in advance

01-15-2009, 08:44 AM

[eluser]obiron2[/eluser]
Short answer - exactly the same as you would any other form.

Long answer -
Whe you usesr the POST method, the http request includes an array called $_POST which contains all of the fields. Where you have many fields with the same name and they are arrayed, you will need to process the fields in groups based on their array indexes. (I am guessing that each row creates one line in your database)

If you want to do validation and represent the form then things are a little more complicated as you would need to appy the validation rules to each field in the array and rebuild the form dynamically based on the number of records.

Obiron

P.S. please don't use tables to force layout. use DIVs and SPANs and CSS. you will thank me in the long run.

01-15-2009, 09:43 AM

[eluser]Unknown[/eluser]
Thanks for reply.

P.S. please don’t use tables to force layout. use DIVs and SPANs and CSS.
Do you mean by this that i should use divs on my index page?

Long answer would be nice to learn.
because i want to deposite the data into database.

Right know i am writing validation with javascript.

01-15-2009, 06:28 PM

[eluser]jonhurlock[/eluser]
With regards to the P.C. about the use of DIVS, SPANS, and CSS. Try reading the following:

A list apart - pretty accessible forms

Hope that helped Big Grin