I initially hide the remove button when the form is still one, but when there are many forms and the user deletes all the forms then what I want the last form should not be deleted / hidden. Please help.
This is my code :
<!doctype html><html lang="en"><head><title>Dynamic Form</title><link rel="canonical" href="https://getbootstrap.com/docs/4.0/examples/sticky-footer/"><!-- Bootstrap core CSS --><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"></head><body><div class="container"><div class="row"><div class="col-md-12"><table class="table" id="dynamic"><tr id="row1"><td><div class="card-body"><div class="form-group"><div class="table-responsive"><input type="text" placeholder="Masukkan Nama" class="form-control" /></div></div></div></td><td class="first_row" style="display:none;"><button type="button" id="1" class="btn btn-danger btn_remove">Hapus</button></td></tr></table><button type="button" id="tambah" class="btn btn-success">Add</button></div></div></div><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script><script type="text/javascript">
$(document).ready(function() {
var no = 1;
$('#tambah').click(function() {
$('.first_row').show();
no++;
$('#dynamic').append('<tr id="row' + no + '"><td><div class="card-body"><div class="form-group"><div class="table-responsive"><input type="text" name="name[]" placeholder="Masukkan Nama" class="form-control" /></div></div></div></td><td><button type="button" id="' + no + '" class="btn btn-danger btn_remove">Hapus</button></td></tr>');
});
$(document).on('click', '.btn_remove', function() {
var button_id = $(this).attr("id");
$('#row' + button_id + '').remove();
});
});</script></body></html>