I have a bootstrap modal form that opens up when you click on the edit button. Unfortunately, the update query does not execute. Kindly help me see where I am going wrong. Thank you.
The button code is
<td><button type="button" class="btn btn-success editbtn">Edit House</button></td>
The modal form gets the data passed because I see it when I inspect the console.
<div class="modal fade" id="editmodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Edit</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form class="form-sample" form action="updatehouse.php" method="POST">
<div class="content-wrapper">
<div class="row">
<div class="col-12 grid-margin">
<div class="card">
<div class="card-body">
<h4 class="card-title">Update Property</h4>
<div class="form-group">
<label for="house">House Name</label>
<input type="hidden" name="house_id" id="house_id"/>
<input type="text" class="form-control" id="house_name" name="house_name" />
</div>
<div class="form-group">
<label for="landlord">Landlord</label>
<input type="text" class="form-control" id="house_landlord" name="house_landlord" />
</div>
<div class="form-group">
<label for="location">Location</label>
<input type="text" class="form-control" id="house_location" name="house_location" />
</div>
<div class="form-group">
<label for="commission">Commission</label>
<input type="text" class="form-control" id="house_commission" name="house_commission" />
</div>
<div class="form-group">
<label for="serviceCharge">Service Charge</label>
<input type="text" class="form-control" id="house_service_charge" name="house_service_charge" />
<input type="hidden" name="house_siku_added" id="house_siku_added"/>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" name="submit" id="submit">Save changes</button>
</div>
</form>
</div>
</div>
</div>
</div>
To trigger the button to open the modal, I call the script
<script>
$(document).ready(function() {
$('.editbtn').on('click', function(){
$('#editmodal').modal('show');
$tr = $(this).closest('tr');
var data = $tr.children("td").map(function(){
return $(this).text();
}).get();
console.log(data);
$('#house_id').val(data[0]);
$('#house_name').val(data[1]);
$('#house_landlord').val(data[2]);
$('#house_location').val(data[3]);
$('#house_commission').val(data[4]);
$('#house_service_charge').val(data[5]);
$('#house_siku_added').val(data[6]);
});
});
</script>
The updatehouse.php
include('config/db_connect.php');
if(isset($_POST["submit"]))
{
$house_id = $_POST['$house_id'];
$house_name = $_POST['$house_name'];
$house_landlord = $_POST['$house_landlord'];
$house_location = $_POST['$house_location'];
$house_commission = $_POST['$house_commission'];
$house_service_charge = $_POST['$house_service_charge'];
$house_siku_added = $_POST['$house_siku_added'];
$sql = "UPDATE houses SET house_name = '$house_name', house_landlord = '$house_landlord', house_location = '$house_location', house_commission = '$house_commission', house_service_charge = '$house_service_charge', house_siku_added = '$house_siku_added' WHERE house_id = '{$house_id}'";
$sqlQuery = mysqli_query($connection, $sql);
if($sqlQuery){
echo '<script> alert("Record was updated successfully."); </script>';
header("Location:listhouses.php");
}
else
{
echo '<script> alert("Data not updated"); </script>';
}
}
?>