Doesn't display new data after making changes
I created a search function for my web page so that it can update information. When I search for a record and update the information. Then go back to find the entry again that the original information shows. I check the MySQL database and it really shows that the information is not changing why this is happening. Has anyone encountered this problem before?
Here is my index.php form
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<meta content="IE=9" http-equiv="X-UA-Compatible">
<link href="css/style01.css" rel="stylesheet"><!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<h2 style="text-align: center">Inventory Integrity Edit Request
Form</h2><br>
<br>
<div class="wrapper">
<div class="mainContent">
<form class="form-horizontal" method="get">
<div class="form-group">
<br>
<br>
<label class="col-sm-2 control-label" for="id">Enter
Request ID #</label>
<div class="input-group col-sm-9">
<input class="form-control" id="id" name="=id"
placeholder="Type the id" type="text"> <span class=
"input-group-btn"><button class=
"btn btn-default btnSearch" type="button"><span class=
"input-group-btn"><span class=
"input-group-btn"><span class=
"input-group-btn"><span class=
"input-group-btn"><span class=
"input-group-btn"><span class=
"glyphicon glyphicon-search">Search</span></span></span></span></span></span></button></span>
</div>
</div>
</form>
<div class="col-sm-2"></div>
<div class="col-sm-9">
<!-- This table is where the data is display. -->
<table class="table table-striped table-hover" id=
"resultTable">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>lanId</th>
<th>Department</th>
<th>Manager</th>
<th>Work Requested</th>
<th>PO</th>
<th>IS</th>
<th>Request Comments</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div><!-- jQuery (necessary for Bootstrap JavaScript plugins) -->
<script src="js/jquery-1.10.2.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script> <script type="text/javascript">
jQuery(document).ready(function($) {
$('.btnSearch').click(function(){
makeAjaxRequest();
});
$('form').submit(function(e){
e.preventDefault();
makeAjaxRequest();
return false;
});
function makeAjaxRequest() {
$.ajax({
url: 'php/search.php',
type: 'get',
data: {id: $('input#id').val()},
success: function(response) {
$('table#resultTable tbody').html(response);
}
});
}
});
</script>
</body>
</html>
Here is my search.php form
<?php
require_once 'db_connect.php';
$conn = dbConnect();
$OK = true; // We use this to verify the status of the update.
if (isset($_GET['id'])) {
// Create the query
$data = "%".$_GET['id']."%";
$sql = 'SELECT * FROM requests WHERE id like ?';
$stmt = $conn->prepare($sql);
$results = $stmt->execute(array($data));
$rows = $stmt->fetchAll();
$error = $stmt->errorInfo();
//echo $error[2];
}
// If there are no records.
if(empty($rows)) {
echo "<tr>";
echo "<td colspan='4'>There were not records</td>";
echo "</tr>";
}
else {
foreach ($rows as $row) {
echo "<tr>";
$id = $row['id'];
echo "<td><a href='update.php?id=$id'>$id</a></td>";
echo "<td>".$row['name']."</td>";
echo "<td>".$row['lanId']."</td>";
echo "<td>".$row['department']."</td>";
echo "<td>".$row['mgrname']."</td>";
echo "<td>".$row['work_requested']."</td>";
echo "<td>".$row['purchase_order']."</td>";
echo "<td>".$row['inbound_shipment']."</td>";
echo "<td>".$row['request_comments']."</td>";
echo "</tr>";
}
}
?>
+3
source to share
1 answer
disable ajax caching:
$.ajax({
url: 'php/search.php',
cache: false,
type: 'get',
data: {
id: $('input#id').val()
},
success: function (response) {
$('table#resultTable tbody').html(response);
}
});
change from jQuery
API documentation for jQuery.ajax()
:
cache (default: true, false for dataType 'script' and 'jsonp')
+3
source to share