This makes me so confused, I cannot save my form in my database.
See image below. Form image 
The EXAMPLE database is only saved ...
therefore, when you see it not 1, 2,3,4, but on the image was 1,3,2,4 how can I keep it orderly?
HTML CODE
<table cellpadding="5" cellspacing="0" width="100%" class="computation_table"> <tr> <th></th> <th>Categorieën</th> <th>Aantal</th> <th>Omschrijving</th> <th>Bedrag</th> <th>Totaal</th> <th>BTW</th> <th></th> </tr> <tr> <td> <a id="add_new_element"><img src="images/add.png" width="20" alt="add product" /></a> <a id="add_new_category"><img src="images/cat.png" alt="add category" /></a> </td> <td align="left" colspan="6"> <input type="text" name="input[0][cat_name]" style="font-weight:bold;" value="Categorie naam" /> </td> </tr> <tr> <td> <a id="add_new_element"><img src="images/add.png" width="20" alt="add product" /></a> <a id="add_new_category"><img src="images/cat.png" alt="add category" /></a> </td> <td> <input type="text" name="input[0][category]" class="text_com" value="" /> </td> <td> <input type="text" name="input[0][quantity]" id="new_quan" class="quantity text_com" value="" /> x </td> <td width="180"> <textarea name="input[0][quo_definition]" class="input"></textarea> </td> <td> <input type="text" name="input[0][quo_amt]" id="new_amt" class="quantity text_com" value="0" /> </td> <td id="total"> <span id="view_total_0">0</span> <input type="hidden" name="input[0][quo_total]" id="new_total" class="quantity text_com" value="0" /> </td> <td> <select name="input[0][quo_btw]" class="btwselect"> <option value="21%" selected="selected">21%</option> <option value="6%">6%</option> <option value="0%">0%</option> </select> </td> </tr> </table> <br /> <div class="ClientProductItemsSubTotal"> <table cellpadding="5" cellspacing="0" width="100%"> <tr> <td><strong>Korting</strong></td><td><input type="text" name="discount" class="quantity" value="" /></td> </tr> </table> </div>
for DB $input = array();
foreach( $_POST['input'] as $input ) { $mysqli->query( "INSERT INTO jon_com_quo_computation VALUE('', '$uc', '$cc', '$ct', '$cur', '', '".$input['cat_name']."', '".$input['category']."', '".$input['quantity']."', '".$input['quo_definition']."', '".$input['quo_amt']."', '".$input['quo_total']."', '".$input['quo_btw']."', '$dis', '', '', '1', 'new', NOW() )" ); }
jQuery to add the form below ... which should be at the bottom ... I used .insertAfter(rowfield);
jQuery(function() { id = 0; jQuery('a#add_new_element').live('click', function() { id++; var rowfield = jQuery(this).parent().parent();//add some .parent() untill you get the TR element jQuery('<tr><td><a id="add_new_element"><img src="images/add.png" width="20" alt="add product" /></a> <a id="add_new_category"><img src="images/cat.png" alt="add category" /></a></td><td><input type="text" name="input['+id+'][category]" class="text_com" value="" /></td><td><input type="text" name="input['+id+'][quantity]" id="new_quan" class="quantity" value="" /> x</td><td width="200"><textarea name="input['+id+'][quo_definition]" class="input"></textarea></td><td><input type="text" name="input['+id+'][quo_amt]" id="new_amt" class="quantity" value="0" /></td><td><span id="view_total_'+id+'">0</span><input type="hidden" id="new_total" name="input['+id+'][quo_total]" class="quantity" value="0" /></td><td><select name="input['+id+'][quo_btw]" class="btwselect"><option value="21%" selected="selected">21%</option><option value="6%">6%</option><option value="0%">0%</option></select></td><td><a id="del_row"><img src="images/del.png" class="DelRow" alt="delete" /></a></td></tr>').insertAfter(rowfield); });
Thank you so much for sharing your ideas ...
Edited: for more clarification ... There are two things that I need to fix. Firstly, when it stores in my database, ordered is actually not the case. It should be abcd not acbd
Secondly, I'm not sure that I will use insertAfter() or insertBefore() What my boss wants is that he can add any form - when he presses the add button, it should be added below.
For example, when I click the green + add button, it should add to the last tr that has already been added.
I am open to explain more ..