- Beranda
- Programmer Forum
Bagaimana cara membuat select option pada input dinamis PHP
...
TS
bajiroot666
Bagaimana cara membuat select option pada input dinamis PHP
Hallow agan2.. gw punya scritp seperti ini nich:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<link rel="stylesheet" href="style.css">
[removed][removed]
</head>
<body>
<form id="id_form" action="save.php" method="post">
<table>
<tr>
<td><input type="button" name="add_btn" value="Add" id="add_btn"></td><td> </td><td> </td><td> </td>
</tr>
<tr>
<td>No</td><td>Item</td><td>Code Item</td><td> </td>
</tr>
<tbody id="container">
<!-- nanti rows nya muncul di sini -->
</tbody>
<tr>
<td><input type="submit" name=submit value="Save"></td><td> </td><td> </td><td> </td>
</tr>
</table>
</form>
</body>
</html>
aq due jquery
$("#add_btn").click(function(){
count += 1;
$('#container').append(
'<tr class="records">'
+ '<td><div id="'+count+'">' + count + '</div></td>'
+ '<td><input class="form-control form-control-sm" name="kode_1' + count + '" id="kode_1" disabled></td>'
+ '<td><select class="form-control-sm form-control" name="kategori_biaya' + count + '" id="site"><option></option>
<?php include "koneksi.php";$result1 = mysql_query("select * from kode1 order by kode_1");
$jsArray1 = "var dtsite = new Array();";while ($row = mysql_fetch_array($result1)) { echo '
<option value="' . $row['kategori_biaya'] . '">' . $row['kategori_biaya'] . '</option>';
$jsArray1 .= "dtsite['" . $row['kategori_biaya'] . "'] =
{kode_1:'" . addslashes($row['kode_1']) . "'};";}?>
</select>
</td>'
Penjelasan singkatnya, gw mau bikin input dinamis dengan php.. pada script diatas, pada baris input pertama, ketika select kategori barang, maka pada field input akan muncul kode barang secara otomatis..
Nah yang jadi masalah ketika saya menambahkan baris ke dua (add row input dinamis).. ketika dilakukan select kategori biaya, yang berubah bukan kode barang pada baris ke 2 tapi tetap yang di baris (row) pertama..
Mohon pencerahannya agan2 🙏
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<link rel="stylesheet" href="style.css">
[removed][removed]
</head>
<body>
<form id="id_form" action="save.php" method="post">
<table>
<tr>
<td><input type="button" name="add_btn" value="Add" id="add_btn"></td><td> </td><td> </td><td> </td>
</tr>
<tr>
<td>No</td><td>Item</td><td>Code Item</td><td> </td>
</tr>
<tbody id="container">
<!-- nanti rows nya muncul di sini -->
</tbody>
<tr>
<td><input type="submit" name=submit value="Save"></td><td> </td><td> </td><td> </td>
</tr>
</table>
</form>
</body>
</html>
aq due jquery
$("#add_btn").click(function(){
count += 1;
$('#container').append(
'<tr class="records">'
+ '<td><div id="'+count+'">' + count + '</div></td>'
+ '<td><input class="form-control form-control-sm" name="kode_1' + count + '" id="kode_1" disabled></td>'
+ '<td><select class="form-control-sm form-control" name="kategori_biaya' + count + '" id="site"><option></option>
<?php include "koneksi.php";$result1 = mysql_query("select * from kode1 order by kode_1");
$jsArray1 = "var dtsite = new Array();";while ($row = mysql_fetch_array($result1)) { echo '
<option value="' . $row['kategori_biaya'] . '">' . $row['kategori_biaya'] . '</option>';
$jsArray1 .= "dtsite['" . $row['kategori_biaya'] . "'] =
{kode_1:'" . addslashes($row['kode_1']) . "'};";}?>
</select>
</td>'
Penjelasan singkatnya, gw mau bikin input dinamis dengan php.. pada script diatas, pada baris input pertama, ketika select kategori barang, maka pada field input akan muncul kode barang secara otomatis..
Nah yang jadi masalah ketika saya menambahkan baris ke dua (add row input dinamis).. ketika dilakukan select kategori biaya, yang berubah bukan kode barang pada baris ke 2 tapi tetap yang di baris (row) pertama..
Mohon pencerahannya agan2 🙏
nona212 memberi reputasi
1
3.8K
18
Komentar yang asik ya
Mari bergabung, dapatkan informasi dan teman baru!
Programmer Forum
20.2KThread•5KAnggota
Tampilkan semua post
eternu5
#5
Quote:
Bingo
Kalo dicoba inspect element lamannya, bagian input text "kode" punya id yang sama: 'kode_1'
Quote:
Id form input "kode_1" harus unik tiap row, jadi ketika add_btn di klik, container form input "kode_1" yang ditambahin ke container harus punya id yang berbeda. Bisa dengan di-append dengan "count", jadi kayak gini
Spoiler for code:
sehingga form input "kode_1" di tiap baris akan punya id:
kode_1_1
kode_1_2
kode_1_3
kode_1_4
...
Ini cuma contoh supaya id tiap form input "kode_1" beda. Bug ini terjadi karena document.getElementId nyoba nyari element dengan id "kode_1" dan (mungkin akan) didapat banyak element dengan id tersebut. Kebetulan document.getElementId ngambilnya elemen yang pertama, sehingga ketika kategori biaya diubah, form input "kode_1" yang akan ikut berubah yang ada di baris pertama.
Selanjutnya tinggal menyesuaikan id form input yang benar di document.getElementId. Cara untuk melakukan penyesuaian gue serahin ke u
0
Tutup