Live Chat using PHP and JavaScript

Submitted by rinvizle on Wednesday, August 17, 2016 - 10:20.

In this tutorial we will create a Live Chat Using PHP and jQuery. This live chat application we will be creating is a simple web-based application that creates a chat or message through the other users of this application. And it will include a login and logout system using Ajax features and it will also support for multiple users. See the example code below.

Sample Code

Index.php - For creating a login form using PHP that will ask the user their name before they continue to the chatting area.

<?php
session_start();
 
function loginForm(){
    echo'
    <div id="loginform">
    <form action="index.php" method="post">
        <p>Please enter your name to continue:</p>
        <label for="name">Name:</label>
        <input type="text" name="name" id="name" />
        <input type="submit" name="enter" id="enter" value="Enter" />
    </form>
    </div>
    ';
}
 
if(isset($_POST['enter'])){
    if($_POST['name'] != ""){
        $_SESSION['name'] = stripslashes(htmlspecialchars($_POST['name']));
    }
    else{
        echo '<span class="error">Please type in a name</span>';
    }
}
?>

Post.php - We have created a data that being sent to the post.php file each time the user submits the form and sends a new message. It will now create a script to get the data and display it to the chat log.

<?php
session_start();
if(isset($_SESSION['name'])){
    $text = $_POST['text'];
     
    $cb = fopen("log.html", 'a');
    fwrite($cb, "<div class='msgln'>(".date("g:i A").") <b>".$_SESSION['name']."</b>: ".stripslashes(htmlspecialchars($text))."<br></div>");
    fclose($cb);
}
?>