I want to display all my textarea inputs in my browser (because if I refresh my page all data is gone from what i have sent through my html form using jquery/ajax ). So currently using jquery/ajax information from homepage.php is being sent to data.php through my #textarea input and returned on success to be displayed is my #status div. Every time i hit the POST button the data is added to the browser but when I refresh the page data is all lost ( even though the information is stored in my sql table). I understand i need to use a while() loop and I have tried but none of my code works in respect to what I am trying to achieve.
Homepage.php
<?php
include("connection.php");
session_start();
if(isset($_SESSION['user_id']) && $_SESSION['user_id'] != "") {
$sid = $_SESSION['user_id'];
$conn = new mysqli(DB_HOST, DB_USER, DB_PASS, DB_NAME);
$sql = "SELECT * FROM `users` WHERE id='{$sid}'";
$query = $conn->query($sql);
$result = $query->fetch_assoc();
$fname = $result['fname'];
$lname = $result['lname'];
$time = time();
}
else {
header("location:login.php");
}
?>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
//daddy code
$ (document).ready(function() {
//mama code
$("button#postbutton").click(function() {
var data = $("#formpost").serialize();
var posterid = <?php echo $sid; ?>;
$.ajax({
type: "POST",
url: "data.php",
data: data,
success: function(data) {
$("#statustext").append(data);
$("textarea#text1").val('');
}
});
});
});
</script>
</head>
<body>
<div id="global">
<form id="formpost" action="" method="post" onsubmit="return false">
<textarea id="text1" name="status" value="" ></textarea>
<button id="postbutton">POST</button>
<a href="logout.php">LOGOUT</a>
</form>
<br/>
<br/>
<div id="allstatus">
<!-- SKELETON -->
<div id="wholestatus">
<div id="statuspic">
</div>
<div id="statusinfo">
<div id="statusname"><?php echo " Welcome to VLE, {$fname} {$lname} ";?></div>
<div id="statustext"> </div>
</div>
</div>
<!-- SKELETON -->
</div>
</div>
</body>
</html>
data.php
<?php
const DB_HOST = 'localhost';
const DB_USER = 'root';
const DB_PASS = '';
const DB_NAME = 'forum';
//connecting
$conn = new mysqli(DB_HOST, DB_USER, DB_PASS, DB_NAME);
if($conn->connect_error) {
die("Connection Failed: " . $conn->connect_error);
} else {
}
if(isset($_POST['status']))
{
$var = $_POST['status'];
$sql = "INSERT INTO `question`(id, question) VALUES ('', '{$var}')";
$result = $conn->query($sql);
if($result) { }
else {
echo "failed: " . $conn->error;
}
echo "<br>{$var}";
}
?>
Your select is calling for a specific Session id but your insert is not storing anything inside id column.
I'm not sure why you keep talking about page refreshes if you're using ajax, because ajax allows you to send/retrieve data without a page refresh.
In your success function, anything that is returned is in your variable called data
, but I bet if you looked at the contents of this variable you will see that it doesn't have anything because your data.php
is not setup to give a proper response.
You need this in your data.php
file...
header('Content-Type: application/json');
And then when you echo the response, you need to do it like this...
echo json_encode($var);
Now within the success function your data
will hold the contents of $var
which is actually holding the contents of $_POST['status']
.
So then within the success function you can display the results like this...
$('#statustext').html(data)