Ajax autofill hanya berfungsi pada row pertama pada form dinamis

Tolong bantuanya saya sedang belajar membuat form dinamis dengan isi otomatis AJAX, tetapi hanya berhasil di row pertama,row ke 2 dan selanjutnya tidak,mohon bantuannya

<script>
		$(function() {
			$("#menifest").on('change',function(){
				var menifest = $("#menifest").val();
 
				$.ajax({
					url: 'ajaxpemusnahan.php',
					type: 'POST',
					dataType: 'json',
					data: {
						'menifest': menifest
					},
					success: function (pemusnahan) {
						$("#nama_limbah").val(pemusnahan['nama_limbah']);
						$("#penghasil").val(pemusnahan['penghasil']);
            $("#waste_id").val(pemusnahan['waste_id']);
            $("#qty").val(pemusnahan['qty']);
            $("#satuan").val(pemusnahan['satuan']);
            $("#penyimpanan").val(pemusnahan['penyimpanan']);
            $("#rack").val(pemusnahan['rack']);
           
        }
				});
			});
		});
    </script>
      <script>
        function btnadd()
        {
          var v =  $(".TRow").clone().appendTo('TBody') ;
          $(v).find("input").val('');
          $(v).removeClass("d-none");
        }

        function BtnDel(v) {

            $(v).parent().parent().remove();
        }

        </script>
  

ini kode conectnya

<?php
include 'function.php';
 
$query = mysqli_query($conn, "SELECT * FROM incoming WHERE menifest='".mysqli_escape_string($conn, $_POST['menifest'])."'");
$data = mysqli_fetch_array($query);
 




echo json_encode($data);
?>

ini kode formnya

  <table class="table">
  <thead class = "table-success" class="col 8">
    <tr>
      <th> No Manifest</th>
      <th> Waste ID</th>
      <th >Nama Limbah</th>
      <th >Penghasil Limbah</th>
      <th >Tanggal Receiving</th>
      <th>QTY</th>
      <th>Kemasan</th>
      <th >Waste Storage</th>
      <th >Calory</th>
      <th >H2O</th>
      <th >Ash</th>
      <th >S</th>
      <th >Cl</th>
      <th >
        <button type="button" class="btn btn-success" onclick="btnadd()">+</button></th>
       
  </tr>
  </thead>
  <tbody name="TBody">
    <tr class="TRow" class="d-none">
      <td><input type="text" class="form-control mr-sm-8" name="menifest" id="menifest" ></td>
      <td><input type="text" class="form-control mr-sm-2" name="nama" id="waste_id" ></td>
      <td><input type="text" class="form-control" name = "nama_limbah" id="nama_limbah"></td>
      <td><input type="text" class="form-control" name = "penghasil" id="penghasil"></td>
      <td><input type="text" class="form-control" name = "tanggal" id="tanggal"></td>
      <td><input type="text" class="form-control" name = "qty" id="qty"></td>
      <td><input type="text" class="form-control" name = "satuan" id="satuan"></td>
      <td><input type="text" class="form-control" name = "penyimpanan" id="penimpanan"></td>
      <td><input type="text" class="form-control" name = "calory" id="calory"></td>
      <td><input type="text" class="form-control" name = "h2o" id= "h2o"></td>
      <td><input type="text" class="form-control" name = "ash" id= "ash"></td>
      <td><input type="text" class="form-control" name = "s" id="s"></td>
      <td><input type="text" class="form-control" name = "cl" id="cl"></td>
      <td><button type="button" class="btn btn-danger" onclick="BtnDel(this)">X</button></td>
      
    </tr>
   
  </tbody>
</table>
avatar muhammadaldiwijaya
@muhammadaldiwijaya

2 Kontribusi 0 Poin

Diperbarui 3 bulan yang lalu

Tanggapan

Halo, kamu perlu memperlihatkan kode yang kamu buat (coba baca aturan main) agar kamu bisa dibantu.

sudah saya edit ka,mohon bantuannya

1 Jawaban:

Berikut beberapa cara bantu kamu debug:

  • Test endpoint backend langsung, apakah hasilnya sudah sesuai yang kamu mau
  • console.log repon dari backend, apakah responnya semua sudah ada pada data di frontend setelah AJAX

Jika kedua hal tersebut sudah benar, berarti yang hanya diperlukan sekarang adalah cara menampilkan data dengan tepat pada sisi Javascript.

Jika belum, berarti kesalah ada pada backend atau responnya

avatar hilmanski
@hilmanski

2670 Kontribusi 2132 Poin

Dipost 3 bulan yang lalu

Login untuk ikut Jawaban