PHP Private Chat Long polling integration

Question

i've got a simple question here,

Ive got this form thats inside my chat html:

<form action="../addchat.php" method="POST" enctype="multipart/form-data"> 
                    <textarea id="textarea" style="border-radius:0px; border:none; background-color:rgb(243,243,243); min-height:100px;"name="comment" rows="4" cols="50"></textarea><br>
                    <input height="25px" width="20px" style="float:right;" type="image" src="../arrow.png" name="submit" value="Comment">

</form>

This form is for users to submit their chat messages. and after which, form post will direct the information to addchat.php, which contains the following code:

<?php
ob_start();
session_start();
include_once("config.php");



$reply=mysqli_real_escape_string($mysqli,$_POST['comment']);
$cid=mysqli_real_escape_string($mysqli,$_SESSION['cid']);
$uid=mysqli_real_escape_string($mysqli,$_SESSION['userid']);
$time=time();
$ip=$_SERVER['REMOTE_ADDR'];
$q= mysqli_query($mysqli,"INSERT INTO conversation_reply (user_id_fk,reply,ip,time,c_id_fk) VALUES ('$uid','$reply','$ip','$time','$cid')") or die(mysqli_error($mysqli)); 

?>

This script obviously adds the data into the tables and after which another script on the chat html page will display out the chat messages.

However, the current issue is that firstly, after user click submit, page will redirect to another blank page and show success message. Secondly, user need to refresh to see the new chat messages.

This chat application is a private chat (similar to Facebook), so not very sure how to do it? Would appreciate some help:)

Answer 1

If you do not want it to redirect. Move the PHP code to the same file as the form. You could use include for this. Then make the form action="". Then around the PHP, you need to check that the POST exists so it only runs when the form submits: e.g.

 if (!empty($_POST))

As for the refresh problem. You may want to look into AJAX or even socket.io.

Answer 2

standard html form submissions always will submit (and redirect) to the page defined in the action attribute of the form. with jquery you can prevent this default behavior plus send the form-data with ajax:

$("form").on("submit", function(event){
   event.preventDefault();
    $.ajax({
        url: "../addchat.php",
        type: "POST",
        cache: false,
        data: {
            comment: $("#textarea").text()
        },
        success: function(data){
            //something you could do on success of your ajax call.
            //you might not need it in this case.
        }
    });
});

secondly, you'll need some procedure that refreshes your output-area automatically. create a div in your html to show the chat-output:

<div id="chat_content_div"></div>

then you'll have to do something like this in your javascript to refresh it automatically:

var refresh_time = 500; // chat refresh time in ms

setInterval(function(){ 
    $.ajax({
        url: "chat_output.php",
        type: "GET",
        dataType: "html",
        cache: false,
        success: function(data){
            $("#chat_content_div").html(data);
        }
    });
}, refresh_time);

in the "chat_output.php" you only display (html) data from the database to be displayed in this div.

Answer 3

It is not simple to answer this question, as it belongs to how hard/complex you want in your chat application.

1. If you don't want to get redirect when submitting, you can use AJAX to post the form Submit a form using jQuery
2. If you don't want to refresh the page to load new chat messages, you can use AJAX call to get new messages in interval of time http://www.w3schools.com/jsref/met_win_setinterval.asp.
3. If you want to receive new chat messages at the time they are sent from sender (who is chatting with current user), you might consider about using push server like NodeJS (http://nodejs.org) or Socket.io (http://socket.io/)

Answer 4

I wouldn't use PHP for that purpose if I were you, or if you do, you'll need lot of ajax to make this chat working.

ajax request to send... ajax request every n milliseconds to fetch new messages. you should also use an api instead of a webpage to interact with your server-side app. Your server will need to be highy available and respond really fast.

You should choose a language that support websockets (take a look at python with django, for example, or java, or whatever...) if you want this chat to be really efficient.

While writing these lines I found something (Ratchet library)to use websocket in php (I don't know how it works but maybe you'll get problems with the max_execution_time of your server if it works with a "while true" loop)

Edit: as Tuan Duong suggests, nodejs is another good alternative