Load a script for the elements of an array
<p>I am trying to create a dynamic form where you can order something. </p>

<p>In basic form, we have one row, but if you want to order more things we can dynamically without reloading the page, add the new row. So far everything is working properly for me, but in this form we have two dropdown ("input select") lists. These drop-down lists are dependent on each other and do not know how to load them the relationship between them and the option of choice. I have tried many different examples from the internet, but always work correctly only the first default row. Dynamically created rows are no longer dependent on one another.</p>

<p>If I am doing something wrong, and you know a better way, please show me this way.</p>

<p>I ask you for help, because I really depend on that. Thank you in advance. ;)</p>

<p><img src="http://i.stack.imgur.com/dXXZv.jpg" alt="Screenshot of the form"></p>

<hr>

<p><strong>Update</strong></p>

<p>Hmm .. Now I understand, but I do not know much how to use it in my web page code. Will show you the web page code:</p>

<pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;&lt;br&gt;
&lt;html&gt;&lt;br&gt;
    &lt;head&gt;&lt;br&gt;
        &lt;title&gt;Dynamic forms&lt;/title&gt;&lt;br&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;&lt;br&gt;
        &lt;script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;&lt;br&gt;
        &lt;script type="text/javascript" src="http://jquery.bassistance.de/validate/jquery.validate.js"&gt;&lt;/script&gt;&lt;br&gt;
        &lt;script language="javascript" src="chainedselects.js"&gt;&lt;/script&gt;&lt;br&gt;
        &lt;script language="javascript" src="exampleconfig2.js"&gt;&lt;/script&gt;&lt;br&gt;

    &lt;/head&gt;
    &lt;body onload="initListGroup('vehicles', document.formm.elements['group[]'], document.formm.elements['product[]'], 'cs')"&gt;
        &lt;script type="text/javascript"&gt;
            $(document).ready(function(){
               var i = 2;
                var templateRow = jQuery.format($("#template").val());
                function addRow() {
                    var ii = i++;
                    $(templateRow(ii)).appendTo("#listProducts tbody");
                    $("#removeProduct_" + ii).click(function(){
                        $("#row_" + ii).remove();
                    });
                }
                $("#addProduct").click(addRow);
            });
        &lt;/script&gt;

        &lt;!-- Template row in the table --&gt;

        &lt;textarea id="template" style="display:none;" cols="1" rows="1"&gt;
            &lt;tr id="row_{0}" valign="top"&gt;
                &lt;td&gt;{0}.&lt;/td&gt;
                &lt;td&gt;&lt;select name="group[]" style="width: 100%;"&gt;&lt;/select&gt;&lt;/td&gt;
                &lt;td&gt;&lt;select name="product[]" style="width: 100%;"&gt;&lt;/select&gt;&lt;/td&gt;
                &lt;td&gt;&lt;input type="text" name="price[]" style="width: 100px;"&gt;&lt;/td&gt;
                &lt;td&gt;&lt;input type="text" name="quantity[]" style="width: 97%;"&gt;&lt;/td&gt;
                &lt;td&gt;&lt;img src="remove.png" id="removeProduct_{0}" alt="remove"&gt;&lt;/td&gt;
            &lt;/tr&gt;
        &lt;/textarea&gt;

        &lt;!-- This summary table --&gt;

        &lt;form name="formm" action="parser.php" method="post"&gt;
            &lt;table id="listProducts" name="list"&gt;
                &lt;thead&gt;
                    &lt;tr&gt;
                        &lt;th&gt;Nr&lt;/th&gt;
                        &lt;th&gt;Group&lt;/th&gt;
                        &lt;th&gt;Product&lt;/th&gt;
                        &lt;th&gt;Price&lt;/th&gt;
                        &lt;th&gt;Quantity&lt;/th&gt;
                        &lt;th&gt;+/-&lt;/th&gt;
                    &lt;/tr&gt;
                &lt;/thead&gt;
                &lt;tfoot&gt;
                    &lt;tr&gt;
                        &lt;th colspan="3" align="left"&gt;
                            &lt;input type="submit" name="send" value="Send" style="width: 100px;"&gt;
                        &lt;/th&gt;
                    &lt;/tr&gt;
                &lt;/tfoot&gt;
                &lt;tbody&gt;
                    &lt;tr valign="top"&gt;
                        &lt;td&gt;1.&lt;/td&gt;
                        &lt;td&gt;&lt;select name="group[]" style="width: 100%;"&gt;&lt;/select&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;select name="product[]" style="width: 100%;"&gt;&lt;/select&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="text" name="price[]" style="width: 100px;"&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="text" name="quantity[]" style="width: 97%;"&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;img src="add.png" id="addProduct" alt="add"&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                &lt;/tbody&gt;
            &lt;/table&gt;
        &lt;/form&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>This is a parser.php:</p>

<pre><code>&lt;?php
$data = array();

$data['Groups'] = $_POST['group'];
$data['Products'] = $_POST['product'];
$data['Prices'] = $_POST['price'];
$data['Quantity'] = $_POST['quantity'];

$result = print_r($data,true);
echo "&lt;pre&gt;$result&lt;/pre&gt;";
?&gt;
</code></pre>

<p><a href="http://www.filesonic.com/file/3899089365/dynamic_form.rar" rel="nofollow">Here is link to all code</a>.</p>
