Question

I have form with some objects. In case of a dropdown box, when the user clicks the button next to it, a new dropdown box appears under the previous one. The user selects an item, and if he wants, clicks the button again, a new dropdown box appears, he selects an item, an so on.
This is my code for the dropdown box and the button. I have no idea how to make such a thing.

<td>
<?php
echo "<select name=\"dropdown_docs_remove\" id=\"dropdown_docs_remove\">";
    for ($i=0; $i<count($regulationsarr); $i++){
     echo "<option value=\"$i+1\">$regulationsarr[$i]</option>\n";
    }
echo "</select>";
?>
 <INPUT TYPE=BUTTON NAME=btn_removedoc VALUE="+" ONCLICK="add_newdoc_to_remove()">
</td>

Answer 1

This functionality is called AJAX (Asynchronous JavaScript and XML).

In other words it allows a javascript .. script to make a request to the server with some data (just a normal request like a browser does), then process the result and update just a part of your page without refreshing the whole.

This is not that simple task, there are many things to be considered. If you think you will need it and work with this method in the future, spend some time and learn AJAX. jQuery is an awesome javascript library with perfect ajax support, should be alot easier than learning plain Javascript.

Just a hint, you can make a POST (more secure) request with jQuery like this:

$.post('/url/to/your/script.php', {'key1': 'value1', 'key2': 'value2'}, function(result) {
    // This function is called after the server responds, and result holds either RAW response (html or whatever), or you can parse it as JSON by supplying a fourth argument to $.post with value 'JSON'. Here is where you update your HTML page.
});

As for the server side, everything is as it would be for a normal request, except you don’t need (and you shouldn’t) return the whole HTML page, but just a fraction – in your case, the dropdown box HTML you need to be inserted.