I'm trying to refresh a data input into an INPUT through a form and then SUBMIT this to the database to return it as a table on the same page. I want it to do this without showing the refresh of the page.
This is what I have currently. When I put data into any of the INPUT fields and click SUBMIT nothing happens and nothing shows for an error.
<?php
session_start();
error_reporting (E_ALL);
require '../core/cnn.php';
if(isset($_POST['submitsearchprojno'])) {
$searchprojno = $_POST["searchprojno"];
}
if(isset($_POST['submitsearchadd'])) {
$searchaddress = $_POST["searchaddress"];
}
if(isset($_POST['submitsearchpc'])) {
$searchpostcode = $_POST["searchpostcode"];
}
$searchpostcode = mysql_real_escape_string($searchpostcode);
$searchaddress = mysql_real_escape_string($searchaddress);
$searchprojno = mysql_real_escape_string($searchprojno);
?>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
<h4 class="modal-title">Search Projects</h4>
</div>
<div class="modal-body">
<form class="modal-form" id="searchform" name="searchform" action="" method="post">
<div class="form-group">
<label class="col-md-4 control-label">Project Number</label>
<div class="col-md-6">
<input type="text" class="form-control input-inline input-medium" name="searchprojno" id="searchprojno" placeholder="Enter Project Number">
</div>
<button type="submit" class="btn blue" id="submitsearchprojno" name="submitsearchprojno" >Search <i class="m-icon-swapright m-icon-white"></i></button>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Address</label>
<div class="col-md-6">
<input type="text" class="form-control input-inline input-medium" name="searchaddress" id="searchaddress" placeholder="Enter Address">
</div>
<button type="submit" class="btn blue" id="submitsearchadd" name="submitsearchadd" >Search <i class="m-icon-swapright m-icon-white"></i></button>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Postcode</label>
<div class="col-md-6">
<input type="text" class="form-control input-inline input-medium" name="searchpostcode" id="searchpostcode" placeholder="Enter Postcode">
</div>
<button type="submit" class="btn blue" id="submitsearchpc" name="submitsearchpc" >Search <i class="m-icon-swapright m-icon-white"></i></button>
</div>
<div class="form-group">
<div class="col-md-12">
<div class="table-responsive">
<table class="table table-striped table-bordered table-advance table-hover">
<thead>
<tr>
<th class="col-md-9"><i class="fa fa-list-alt"></i> Address</th>
<th class="col-md-3"></th>
</tr>
</thead>
<tbody>
<tr>
<?php $searchrs = mysql_query("SELECT ProjectNo, CONCAT(COALESCE(HouseNoName, ''), ' ', COALESCE(StreetName, ''), ' ',
COALESCE(TownOrCity, ''), ' ', COALESCE(Postcode, '')) AS Display, PropID, AreaID, AWGMember, Householder, HouseNoName,
StreetName, TownOrCity, Postcode, ContactTelephone, AlternatePhone, Email, PropertyTenure, PropertyNotes
FROM prop_property
WHERE IsActive = 1
AND (Postcode = '".$searchpostcode."'
OR StreetName = '".$searchaddress."'
OR ProjectNo = '".$searchprojno."')
") or die(mysql_error());
$checkrs = mysql_query("SELECT * FROM prop_property WHERE IsActive = 0");
if(!mysql_num_rows($checkrs) > 0) {
echo '<td> No record found!</td><td></td>';
}
else {
while ($results = mysql_fetch_array($searchrs)) {
echo '
<td id="displayadd">'.$results['Display'].'</td>
<td>
<form action="../jobdetails.php" method="post">
<input type="hidden" name="searchhouse" value=" '.$results['HouseNoName'].'" >
<input type="hidden" name="searchstreet" value=" '.$results['StreetName'].'" >
<input type="hidden" name="searchtown" value=" '.$results['TownOrCity'].'" >
<input type="hidden" name="searchpostcode" value=" '.$results['Postcode'].'" >
<input type="hidden" name="searchpropid" value=" '.$results['PropID'].'" >
<input type="hidden" name="searchprojectno" value=" '.$results['ProjectNo'].'" >
<button type="submit" class="btn default btn-xs blue-stripe" id="viewsearch" name="viewsearch">View Address</button>
</form>
</td>';
}
}?>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</form>
<div class="modal-footer right">
<button type="button" data-dismiss="modal" class="btn default">Cancel</button>
</div>
<script type="text/javascript">
$(function(){
$('#searchform').on('submit', function(e){
e.preventDefault();
//alert($('#searchpostcode').val())
$.post('includes/jobdetailssearch.php',
$('#searchform').serialize(),
function(data, status){
$('.table-responsive #displayadd').html(data.Display);
//$("#table-responsive td").last().append(data);
console.log("done");
}).fail(function () {
console.log("fail");
});
});
});
</script>
How can I get it to POST the INPUT to the database and return in the table?