Dynamic Textarea

[Humper]

I am creating a form that needs to be dynamic. I need to be able to select a Delivery Order number from a drop down list and input Highlights into the text box for that specific delivery order. I need to be able to select more then one Delivery Order (one at a time) and have a fresh ext box to type in.

So basically I need to select a Delivery Order from the list then write some data... then pick a new Delivery Order and write some data... I need it to be able to save the data and concatenate it together until you click submit... Is there a way to do this? I have been looking online for a few days now but cant find anything (I may not be looking for the correct things).

What I cant figure out is how to create a new textarea based on the Delivery Order selected..... is there a way to do this without refreshing the page??




<form name="WDR" action="WDR_add.php" method="post">
<table>
<tr>
<td>
<strong>Select Delivery Order:</strong><br />
<select name="DO">
<option value="#" selected="selected">Select Delivery Order</option>
<?php
$query = "SELECT DONum, TaskName FROM DeliveryOrders ORDER BY TaskName";
$result = mysql_query($query);

while($row= mysql_fetch_array($result))
{
$DONum = $row["DONum"];
$TaskName = $row["TaskName"];
$DO = $DONum . " " . $TaskName;
print "<option value=\"$DONum\" onClick=\"this.form.Highlights.value=this.form.Highlights.value.concat('$DO');\" > $DO </option>";
}
?>
</select></td>
</tr>
<tr>
<td>
<strong>Reporting Period Highlights:</strong><br />
<textarea name="Highlights" cols="50" rows="9" id="Highlights"></textarea>
</td>
</tr>
</table>
</form>

[zaphod42]

to create a new element in javascript, you just use:


var newTextArea=document.createElement('textarea')
document.body.appendChild(newTextArea)

you can replace "document.body" with the element reference to the form you are adding it to if you want...

Obviously there are attributes you may set, name, id, style, etc. I generally set those before I append the element, it seems to work better;)