Comments show up in database, but only show up on my index page after a refresh
I have AJAX, PHP, jquery, and mySQL in this very simple website I'm trying to make. All there is is a text area that sends data to the database and uses ajax\jquery to display that data onto the index page. For some reason though, I press submit and the data goes to the database, but I have to refresh the page myself to see that data on the page. I'm assuming that the problem has to do with my AJAX JQuery or even some mistake in the index. Also, when I type the text into the text area and press submit, the text remains in the textarea u开发者_如何学Gontil I refresh the page. Haha, sorry if this is such a noob question.. I'm trying to learn. Thanks so much
Here is the AJAX:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$(".submit").click(function()
{
var comment = $("#comment").val();
var post_id = $("#post").val();
var dataString = '&comment=' + comment
if(comment=='')
{
alert('Fill something in please!');
}
else
{
$("#flash").show();
$("#flash").fadeIn(400).html('<img src="noworries.jpg" /> ');
$.ajax({
type: "POST",
url: "commentajax.php",
data: dataString,
cache: false,
success: function(html){
$("ol#update").append(html);
$("ol#update li:last").fadeIn("slow");
$("#flash").hide();
}
});
}return false;
}); });
</script>
Here is the index\form area:
<body>
<div id="container"><img src="banner.jpg" width="890" height="150" alt="title" /></div>
<id="update" class="timeline">
<div id="flash"></div>
<div id="container">
<form action="#" method="post">
<textarea name="comment" id="comment" cols="35" rows="4"></textarea><br />
<input name="submit" type="submit" class="submit" id="submit" value=" Submit Comment " /><br />
</form>
</div>
<id="update" class="timeline">
<?php
include('config.php');
//$post_id value comes from the POSTS table
$prefix="I'm happy when";
$sql=mysql_query("select * from comments order by com_id desc");
while($row=mysql_fetch_array($sql))
{
$comment=$row['com_dis'];
?>
<!--Displaying comments-->
<div id="container">
<class="box">
<?php echo "$prefix $comment"; ?>
</div>
<?php
}
?>
Here is my commentajax.php
<?php
include('config.php');
if($_POST)
{
$comment=$_POST['comment'];
$comment=mysql_real_escape_string($comment);
mysql_query("INSERT INTO comments(com_id,com_dis) VALUES ('NULL', '$comment')");
}
?>
<li class="box"><br />
<?php echo $comment; ?>
</li>
I'm sorry for so much code but I just started learning this four days ago and this is probably one of the last bugs until the website is functional.
what is this? (copied from your code)
<id="update" class="timeline">
and
<class="box">
you have tags here that don't exist in html, and I believe it is the root of your problem.
when you say
$("ol#update")
in your JQuery, you are trying to find an ordered list tag with an id of update, which would look like this...
<ol id="update"></ol>
but there is no tag that looks like this in your page. perhaps you need to replace <id="update" class="timeline"> with <ol id="update" class="timeline"></ol>. if this is what you are looking for, please select the check mark next to this answer. thanks!
加载中,请稍侯......
精彩评论