动态表单编辑页面：Laravel 5.2

Question

this is not a big problem, i believe you all have an idea to solve this. please kindly help.

The matter is i've dynamic form, i can save it into DB and call it again into edit page for each rows and its work fine for me but, idk how to add new row again into DB cause variable that i used cant count the rows. Look at this brother

This is My Table View

<tbody>
              <?php foreach($rows as $value): ?>
              <tr>
                <td><textarea class="form-control" rows="3" name="analisa[]" placeholder="Analisa Penyebab" style="resize: none;
                height: 50px">{{$value->analisa}}</textarea></td>
                <td><textarea class="form-control" rows="3" name="tindakan[]" placeholder="Tindakan Perbaikan dan Pencegahan" 
                style="resize: none; height: 50px">{{$value->tindakan}}</textarea></td>
                <td><input class="form-control" type="text" name="pic[] placeholder="PIC" value="{{$value->pic}}"></td>
                <td><input class="form-control" type="date" name="tanggal_pelaksanaan[]" class="picker__table" value="{{$value->tanggal_pelaksanaan}}"></td>
              </tr>
              <?php endforeach?>
            </tbody>
          </table>
<a class="button" href="#" role="button" id="add">&nbspTambah Analisa</a><br><br>

Now look at my Javascript

$(document).ready(function(){
    var i = count($rows);
    $('#add').click(function(){

        $('#tbanalisa tbody').append("<tr>"+"<td>"+i+"</td>"+"<td><textarea class=\"form-control\" rows=\"3\" name=\"analisa[]"+"\" placeholder=\"Analisa Penyebab\" style=\"resize: none; height: 50px\"></textarea></td>"+"<td><textarea class=\"form-control\" rows=\"3\" name=\"tindakan[]"+"\" placeholder=\"Tindakan Perbaikan dan Pencegahan\"style=\"resize: none; height: 50px\"></textarea></td>"+"<td><input class=\"form-control\" type=\"text\" name=\"pic[]"+"\" placeholder=\"PIC\"></td>"+"<td><input class=\"form-control\" type=\"date\" name=\"tanggal_pelaksanaan[]"+"\"></td>"+"</tr>");
    i++; 
    });

});

Imagine that i already have 2 rows, now if i change var i = 3; it works fine, now how it automaticly count how many rows i already have ??

Answer 1

<?php $counter = 0; ?>

You can use a variable say $counter and increment it at each row of the table and access this variable from java script as

$(document).ready(function(){
    var $counter = <?php echo json_encode($counter); ?>;
        $('#add').click(function(){
        $('#tbanalisa tbody').append("<tr>"+"<td>"+i+"</td>"+"<td><textarea class=\"form-control\" rows=\"3\" name=\"analisa[]"+"\" placeholder=\"Analisa Penyebab\" style=\"resize: none; height: 50px\"></textarea></td>"+"<td><textarea class=\"form-control\" rows=\"3\" name=\"tindakan[]"+"\" placeholder=\"Tindakan Perbaikan dan Pencegahan\"style=\"resize: none; height: 50px\"></textarea></td>"+"<td><input class=\"form-control\" type=\"text\" name=\"pic[]"+"\" placeholder=\"PIC\"></td>"+"<td><input class=\"form-control\" type=\"date\" name=\"tanggal_pelaksanaan[]"+"\"></td>"+"</tr>");

        $counter++;
    });

});