Hi!
I’m trying to do a chatboard. I had one that worked really fine, but I’ve migrated to wordpress and had to include it in a template to make it work, and since I was changing it a bit, I wanted to have AJAX error messages that would stay on the page and would not require going to the php file page.
Anyway, here’s the script. It’s very simple for the moment, I plan on checking for spam word, checking the IP against a IP list I have of known spammers, but for now, I just wanted to know if it worked, and… it doesn’t.
If I refresh the page, the new entries show alright. But the script is supposed to make the newest entry appear beneath the form, as well as an error message in case something went wrong. I have neither.
I’ve spent hours on this ajax thing already and I could gladly use some help…
Here’s my form file (the wordpress template) :
[code=html]<script type=”text/javascript”>
$(function() {
$(“#comment-form”).submit(function() {
var user_name = $(this).find(“input[name=user_name]”).val();
var user_email = $(this).find(“input[name=user_email]”).val();
var chat_body = $(this).find(“textarea[name=chat_body]”).val();
$.post(“http://www.mydomain.com/chat/post2.php”,{
user_name:user_name,
user_email:user_email,
chat_body:chat_body
}, function(data) {
if(data!=”Ok”){
$(“.error”).empty().append(data);
}
else{
$(“#resultatAjax”).hide().append(user_name + “à écrit”+ chat_body).slideDown();
}
});
return false;
});
});
</script>
<div id=”container”>
<div id=”content” role=”main”>
<h1 class=”page-title”><?php echo get_the_title(); ?></h1>
<div id=”tag-board”>
<div align=”center”>
<form action=”#” method=”post” id=”comment-form” enctype=”multipart/form-data”>
<fieldset>
<p style=”float:left;padding-left:60px;”><label for=”user_name” class=”formbold”>Nom ou pseudo :</label><br />
<input name=”user_name” id=”user_name” type=”text” size=”25″ maxlength=”255″ /></p>
<p style=”float:right;padding-right:60px;”><label for=”user_email” class=”formbold”>URL :</label><br />
<input name=”user_email” id=”user_email” type=”text” size=”25″ maxlength=”255″ value=”http://” /></p>
<p style=”clear:both;”><label for=”chat_body” class=”formbold”>Commentaire :</label><br /><br />
<textarea class=”center” id=”chat_body” name=”chat_body” cols=”65″ rows=”5″></textarea>
</p>
</fieldset>
<fieldset>
<p align=”center”><input type=”submit” class=”submit” name=”Sign” value=”Go !” size=”25″ /></p>
<div class=”error” style=”color:black;”></div>
</fieldset>
</form>
<div id=”resultatAjax”></div>
</div>
(beneath that, I have the mysql call to get the entries from the database, everything works fine there, so no need to show it)
And my post2.php file:
[code=php]<?
extract($_POST);
if(isset($user_name) && !empty($chat_body)) {
include ‘../wp-content/themes/LEO/connexion.php’;
$q = “insert into shoutbox (id,user_name,chat_body,user_email,date_time,user_ip) VALUES (”,’$user_name’,’$chat_body’,’$user_email’,now(),’$user_ip’)”;
mysql_query($q) or die(mysql_error());
echo “Ok”;
}
else {
echo “On a oublié quelque chose ?”;
}
?>
I tried to alert(data) to see what came through and got nothing, so the problem must be getting the data back from the post2.php file… I now they go through from the form to the post2.php file since they are written into the database.
I could definitely use some help, here ? Thanks!