How to make CRUD (Especially Edit View) of Forms That Generated using Append Row?

I have an add form like this :

It's a master detail form, which the row is appended using jQuery, it's not a problem until I make an edit form using the same PHP file the result are like this : (It's a bit messy I still don't know how to choose the select option value), but the point is, I know it's not a right way to do and edit form like this, can you suggest me how to make an edit form using 1 PHP file and using jQuery ?

Here's the code that I use to show the data, I'm using append row to generate the data stored in my database, I know it's not the right way to do this.

$.get(url)
        .done((response) => {
            $('#modal-form [name=nomor]').val(response.produksi.nomor_laporan);
            $('#modal-form [name=tanggal]').val(response.produksi.tanggal);
            $('#modal-form [name=jumlah_billet]').val(response.produksi.jumlah_billet);
            $('#modal-form [name=jumlah_avalan]').val(response.produksi.jumlah_avalan);
            $('#modal-form [name=mesin]').val(response.produksi.mesin);
            $('#modal-form [name=shift]').val(response.produksi.shift);
            // $('#modal-form [name=foto]').val(response.produksi.foto);
            $('#modal-form [name=anggota]').val(response.produksi.anggota);
            $('#modal-form [name=total_produksi]').val(response.produksi.total_produksi);
            $('#modal-form [id=nama0]').val(response.produksidetail[0].id_aluminium_base).change();
            $('#modal-form [id=berat0]').val(response.produksidetail[0].berat);
            $('#modal-form [id=qty0]').val(response.produksidetail[0].qty);
            var data = '';
            if(response.produksidetail.length>0){
                for(i=1; i<response.produksidetail.length; i++){
                    data += '<tr>';
                    data += '<td>' + '<input type="text" class="form-control matras" name="addmore[' +i+ '][matras]" id="matras' +i+ '" value="' + response.produksidetail[i].no_matras + '">' + '</td>'
                    // data += '<td><select class="form-control nama" name="addmore['+i+'][nama]" id="nama'+i+'" required >' +
                    //             '<option disabled="disabled" selected="selected" value="" >Select Produk</option>' +
                    //             '@foreach($produk as $pro)' +
                    //                 '<option value="{{$pro->id}}" data-berat="{{ $pro->berat_maksimal }}">{{$pro->nama}}</option>' +
                    //             '@endforeach' +
                    //             '</select></td>';
                    // data += '<td>' + response.produksidetail[i].id_aluminium_base + '</td>';
                    data += '<td>' + '<input type="text" class="form-control nama" name="addmore[' +i+ '][nama]" id="nama' +i+ '" value="' + response.produksidetail[i].id_aluminium_base + '">' + '</td>'
                    data += '<td>' + '<input type="text" class="form-control berat" name="addmore[' +i+ '][berat]" id="berat' +i+ '" value="' + response.produksidetail[i].berat + '">' + '</td>'
                    data += '<td>' + '<input type="text" class="form-control qty" name="addmore[' +i+ '][qty]" id="qty' +i+ '" value="' + response.produksidetail[i].qty + '">' + '</td>'
                    data += '<td>' + '<input type="text" class="form-control subtotal" name="addmore[' +i+ '][subtotal]" id="subtotal' +i+ '"readonly>' + '</td>'
                    data += '<td><button id="remove_row" type="button" name="remove_row" class="btn btn-sm btn-danger remove"> -</button></td></tr>'
                    data += '</tr>';
                }
                $('#kas_table').append(data);
                console.log(data);
            }
        })

other problem is, when I close the modal, and I click the edit button again, the row won't reset, it make a new row again below, so in order to reset the form, I use this code, but really it's doesn't work well too.

$("#modal-form").on("hidden.bs.modal", function(){
            $(".modal-body").html("");
        });

Edit: I've solved this by adding this code before the loop

$('#kas_table').empty();

This is my controller that passing the data :

    public function show($id)
{
    $data = array();
    $data['produksi'] = Produksi::find($id);
    $data['produksidetail'] = ProduksiDetail::where('id_laporan_produksi', $id)->get();
    return response()->json($data);
}