Databases
StackOverflow2013
Postsdbo
POAdding Nested form rows PHP/Javascript
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAdding Nested form rows PHP/Javascript
    text
    copied!<p><strong>Overview:</strong> I am creating a dynamic web invoicing system, Most of the page are textareas and I have used tables to nest as they will post data into seperate tables after the form is submitted. When the "Nested" Add a Row is selected, it should add a row inside with form field that has details on which row and which position so it can be gathered in a for loop when it is posted.</p> <p>Image: <a href="http://alhui.com/files/javascript-error.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fQVuF.png" alt="enter image description here"></a></p> <p><strong>Problem:</strong></p> <ol> <li>Adding a row in the circled area does not add it in the last row, It add's it as it is in the image. Additionally it only works on the first item, the second add a row does not even register a click.</li> <li>I am unsure how to get the variables to create the form name[][] in this particular index size and the parents index number (located in javascript line 2-3)</li> </ol> <p><strong>Relevent Code:</strong></p> <p>Javascript</p> <pre><code>$("#additemrow").click(function(){ var currentListItem = $(this).length; var currentJobItem = $(this).parents('#items').index('#items'); currentListItem++; $("#listitem:last").after(/*Blank Form Row*/); bind(); }) </code></pre> <p>PHP</p> <pre><code>&lt;table id="items"&gt; &lt;tr class="item-row"&gt;&lt;td&gt;/*form elements*/&lt;/td&gt;&lt;/tr&gt; &lt;tr class="list-row"&gt; &lt;td colspan=5&gt; &lt;table class="itemlist"&gt; &lt;?php $itemCount = 0; foreach($jobListItem as $items) { foreach($items as $item) { if($problem['item_id'] == $item['item_id']) { ?&gt; &lt;tr id="listitem"&gt; &lt;td class="list-item"&gt; &lt;div class="delete-wpr"&gt; &lt;textarea class="item" name="item[/*A PARENT ITEM NUMBER*/][&lt;?php echo $itemCount;?&gt;][item]"&gt;&lt;/textarea&gt; &lt;a class="deleteitem" href="javascript:;" title="Remove row"&gt;X&lt;/a&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;?php } $itemCount++; } } ?&gt; &lt;tr&gt; &lt;td colspan="5"&gt;&lt;a id="additemrow" href="javascript:;" title="Add a row"&gt;Add a row&lt;/a&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; //NEXT ITEMLIST GOES HERE &lt;/table&gt; </code></pre> <p>EDIT: Foreach Loop is just used to get variables from a array.</p> <p>Please let me know if you need more details or bits of code as im not sure if I have given enough information.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload