Message box with auto post to page

[chris_s]

Hey all. New here to the forums because I need to up my php skills! So here's my first quest. I am looking for a way to create a message box, that will allow a user to input text, and have it post to the page without a complete refresh. I am assuming I'm going to need to implement some type of AJAX and/or jQuery with this as well? I'm not sure where to start. Is it possible to do it without writing to a DB? I did see one tutorial that wrote it to a messages.txt file, however, I could not get it to work.

 

[doddsey_65]

perhaps you should try and start the "quest" first and then come back with some code to show us. no one is going to write code for you, But i may do it if you pay me $50.

 

You can write post content to a file using fopen() and fwrite().

 

You will need to look into jquery's $.post() function in order for your code to post without a refresh.

 

[chris_s]

Tough love always works. Here is the code I have so far:

 

<?php
// The data file where messages are stored.
$dataf = "messages.txt";

// Max length of of messages
$length = 150;

// Number of messages shown.
$comments = 50;

$textsize = 4;

if (!$name)
{ $name = "||"; }
else $name .= ":";

$message = stripslashes($message);

$wrap = intval((20)/($textsize-2))+1;

$message = wordwrap($message, $wrap, ' ', 1);

$comfile = file($dataf);if ($message != "") {$df = fopen ($dataf, "w");

fwrite ($df, "<a href="mailto:$email">@</a>
<a href="/img_articles/10747/$url" target="_blank"><b> $name</b></a>
$messagen<br>");
for ($i = 0; $i < $comments; $i++) {fwrite ($df, $comfile[$i]);}fclose($df);}
Header("Location: $HTTP_REFERER");
?>

 

This code is included in a shout.php file. I also created a messages.txt file to write to. Then I created the following form:

 

<form method="POST" action="shout.php">
<table width="100%">
<tr>
<td>Name:</td>
<td><input size="17" maxlength=18 type="text" name="name"></td>
</tr>
<tr>
<td>URL:</td>
<td><input size="17" maxlength="35" type="text" name="url" value="http://"></td>
</tr>
<tr>
<td>Email:</td>
<td>
<input size="17" maxlength="35" type="text" name="email" value="your@mail.com">
</td>
</tr>
<tr>
<td>Message:</td>
<td><input size="17" maxlength="150" type="text" name="message"></td>
</tr>
<tr>
<td colspan="2">
<center>
<input type="submit" value="Shout">
<input type="reset" value="Clear">
</td></tr></table>

 

I then inserted <?php include "messages.txt" ?> in my index.php file where I wanted the messages to show.

 

This all resulted in the page refreshing, and resulting in a 404 page. Couldn't figure out where it was going wrong. And I do realize that this does not include the jQuery. I'm not sure where to implement the jQuery code...

[doddsey_65]

your 404 error is probably due to this:

 

Header("Location: $HTTP_REFERER");

 

$HTTP_REFERER doesnt exist in your script. Did you perhaps mean

 

header("Location: ".$_SERVER['HTTP_REFERER']);

 

You need to place the jquery code within your HTML. Heres a quick example. You will need to include the jQuery script, either download it from  their website or use googles CDN.

 

<script type="text/javascript">
$(document).ready(function(){
     $('form').submit(function(e){ // the below code will fire when the form is submitted
          e.preventDefault(); // don't send the form via HTTP method

           $.post('.shout.php', 
           {
                  name       :   $('input[name="name"]').val(),
                  url            :   $('input[name="url"]').val(),
                  email        :   $('input[name="email"]').val(),
                  message  :   $('input[name="message"]').val(),
           }, function(data) // data is what will be returned from shout.php
           {
                  alert(data); // do something with the data
            }
});
</script>

 

Then in shout.php instead of using header() to redirect them simply echo something to be sent back to the client script

 

echo 'Form submitted';

 

You will then get an alert saying Form submitted.