I can add many rows for a table. when i click "Add", nothing happened. i want to add many rows and remove rows. this my source code.
<script src="https://code.jquery.com/jquery-3.1.1.slim.js" integrity="sha256-5i/mQ300M779N2OVDrl16lbohwXNUdzL/R2aVUXyXWA="crossorigin="anonymous"></script>
<input class="form-control" type="input" id="id_subtema" name="id_subtema" placeholder="Nama SUb Tema" required="" readonly="">
<input class="form-control" type="number" id="jumlah_soal" name="jumlah_soal" placeholder="Jumlah Soal" required="">
<input type="button" class="btn btn-primary form-control add-row" value="Add">
<table class="table table-bordered table-striped">
<thead>
<tr>
<th align="center" width="25">Pilih</th>
<th>Sub Tema</th>
<th>Jumlah Soal</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox" name="record"></td>
<td></td>
<td></td>
</tr>
@if($subtema_jadwal_count == 0)
<tr>
<td colspan="3" align="center">Tambahkan Sub Tema Ujian</td>
</tr>
@endif
</tbody>
</table>
<button type="button" class="delete-row">Delete Row</button>
<script type="text/javascript">
$(document).ready(function(){$(".add-row").click(function(){
var id_subtema = $("#id_subtema").val();
var jumlah_soal = $("#jumlah_soal").val();
var markup = "<tr><td><input type='checkbox' name='record'></td><td>" + id_subtema + "</td><td>" + jumlah_soal + "</td></tr>";
$("table tbody").append(markup);
});
// Find and remove selected table rows
$(".delete-row").click(function(){
$("table tbody").find('input[name="record"]').each(function(){
if($(this).is(":checked")){
$(this).parents("tr").remove();
}
});
});
});</script>
but my source when running nothing happened. I need help, how to fix this problem.
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire