I'm trying to understand jquery and particularly inserting and displaying data in a mysql table using ajax.
I have been experimenting with this code which inserts and displays records from a mysql database. I'm now trying to get it to display the success message in the div with the id "info" whilst also displaying all the records. I seem to only do one but never both. Many thanks.
form.php
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
function showComment(){
$.ajax({
type:"post",
url:"process_ajax.php",
data:"action=showcomment",
success:function(data){
$("#comment").html(data);
}
});
}
showComment();
$("#button").click(function(){
var username=$("#username").val();
var review=$("#review").val();
$.ajax({
type:"post",
url:"process_ajax.php",
data:"username="+username+"&review="+review+"&action=addcomment",
success:function(data){
$("#info").html(data);
}
});
});
});
</script>
</head>
<body>
<form>
Username : <input type="text" name="username" id="username"/>
</br>
Review : <input type="text" name="review" id="review" />
</br>
<input type="button" value="Send Comment" id="button">
</form>
<div id="info" />
<ul id="comment"></ul>
</body>
</html>
Process_ajax.php
<?php
include_once("db_conx.php");
$action=$_POST["action"];
if($action=="showcomment"){
$show="Select * from user_reviews ORDER by date desc";
$result = $db_conx->query($show);
while($row=mysqli_fetch_array($result)){
echo "<li><b>$row[username]</b> : $row[review]</li>";
}
}
else if($action=="addcomment"){
$username= ($_POST['username']);
$review= ($_POST['review']);
$stmt = $db_conx->prepare('INSERT user_reviews SET username = ?, review=?');
$stmt->bind_param('ss', $username, $review);
$stmt->execute();
if ($stmt->errno) {
echo "There was an error in saving your review. Please try again." . $stmt->error;
}else{
echo "Your review has been saved";
}
}
?>
