When I add a few rows, then I remove a row and say choose a lesson cell
But when it’s deleted, it’s going to happen
<form method="post" id="invoice_form">
<div class="row">
<div class="col-lg-4">
<div class="card shadow mb-4 text-right">
<div class="card-body">
<div class="d-flex flex-column align-items-center text-center p-3 py-4">
<img class="rounded-circle mt-3" width="150px" src="https://st3.depositphotos.com/15648834/17930/v/600/depositphotos_179308454-stock-illustration-unknown-person-silhouette-glasses-profile.jpg">
<div class="form-group">
<label for="" class="control-label">full name</label>
<select name="student_id" id="student_id" class="form-control select3 select2-sm">
<option></option>
<?php echo student($conn); ?>
</select>
<span> <small id="class"><?php echo isset($class) ? "Current Class: ".$class : "" ?></small></span>
<input type="hidden" name="class_id" value="<?php echo isset($class_id) ? $class_id: '' ?>">
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-8">
<!-- Basic Card Example -->
<div class="card shadow mb-4 text-right">
<div class="card-header py-3">
<h6 class="m-0 font-weight-bold text-gray-800">add new</h6>
</div>
<div class="card-body">
<div class="form-group">
<input type="hidden" name="date_created" class="form-control" id="date_created" value="<?php echo isset($_POST["date_created"]) ? $_POST["date_created"] : '' ?>" placeholder="date" readonly>
</div>
<p align="center"> <button class="btn btn-block btn-primary" type="button" id="add_row"><i class="fas fa-fw fa-plus"></i></button></p>
<div class="table-responsive">
<table id="invoice-item-table" class="table table-bordered">
<thead>
<tr>
<th width="15%">code lesson</th>
<th width="34%">subject</th>
<th width="25%">mark</th>
<th>del</th>
</tr>
</thead>
<tbody>
<tr>
<td><span id="sr_no">1</span></td>
<td>
<select name="subject_id[]" id="subject_id1" class="form-control select3 select2-sm input-sm">
<option></option>
<?php echo subject2($conn); ?>
</select>
</td>
<td><input type="text" name="mark[]" id="mark1" data-srno="1" class="form-control input-sm mark" /></td>
<td></td>
</tr>
</tbody>
</table>
<div align="right">
</div>
</div>
</div>
<div class="card-footer">
<div class="d-flex w-100 justify-content-center align-items-center">
<input type="hidden" name="total_item" id="total_item" value="1" />
<input type="hidden" name="token" value="<?php echo Token::create(); ?>">
<p align="center"><input type="submit" name="create_invoice" id="create_invoice" class="btn btn-primary" value="create" /></p>
</div>
</div>
</div>
</div>
</div>
</form>
<script>
$(document).ready(function() {
var final_total_amt = $('#final_total_amt').text();
var count = 1;
var options = $('[name="subject_id[]"]').html()
$('[name="subject_id[]"]').select2()
$(document).on('click', '#add_row', function() {
count++;
$('#total_item').val(count);
var html_code = '';
html_code += '<tr>';
html_code += '<td><span id="sr_no">' + count + '</span></td>';
html_code += '<td><select name="subject_id[]" id="subject_id' + count + '" class="form-control select3">' + options + '</select></td>';
html_code += '<td><input type="text" name="mark[]" id="mark' + count + '" data-srno="' + count + '" class="form-control input-sm number_only mark" /></td>';
html_code += '<td><button type="button" name="remove_row" class="btn btn-danger btn-xs remove_row">X</button></td>';
html_code += '</tr>';
var $row = $(html_code)
$row.find('select').select2()
$('#invoice-item-table').append($row)
});
$(document).on('click','.remove_row', function(){
$(this).closest('tr').remove();
calculate(0,0);
$("#paid").val(0);
})
$('#create_invoice').click(function() {
if ($.trim($('#student_id').val()).length == 0) {
swal({title: "",text: "choose name",icon: "error",button: false,timer: 2500});
return false;
}
for (var no = 1; no <= count; no++) {
console.log({itemname: $('#subject_id' + no).val()});
if ($.trim($('#subject_id' + no).val()).length == 0) {
swal({title: "",text: "choose subject ",icon: "error",button: false,timer: 2500});
$('#subject_id' + no).focus();
return false;
}
if ($.trim($('#mark' + no).val()).length == 0) {
swal({title: "",text: "enter mark",icon: "error",button: false,timer: 2500});
$('#mark' + no).focus();
return false;
}
}
$('#invoice_form').submit();
});
});
$('#date_created').daterangepicker({
singleDatePicker: true,
locale: { format: "YYYY-MM-DD" }
//startDate: moment().subtract(6, 'days')
});
</script>