Live Chat using PHP and JavaScript

Submitted by: 
Language: 
Visitors have accessed this post 10471 times.

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.

  1. <?php
  2.  
  3. function loginForm(){
  4. echo'
  5. <div id="loginform">
  6. <form action="index.php" method="post">
  7. <p>Please enter your name to continue:</p>
  8. <label for="name">Name:</label>
  9. <input type="text" name="name" id="name" />
  10. <input type="submit" name="enter" id="enter" value="Enter" />
  11. </form>
  12. </div>
  13. ';
  14. }
  15.  
  16. if(isset($_POST['enter'])){
  17. if($_POST['name'] != ""){
  18. $_SESSION['name'] = stripslashes(htmlspecialchars($_POST['name']));
  19. }
  20. else{
  21. echo '<span class="error">Please type in a name</span>';
  22. }
  23. }
  24. ?>

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.

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

Hope that you learn in my tutorial. Don't forget to LIKE & SHARE this website. Enjoy Coding.


Comments

How are you message reply.
Please guide me.

in this code, "attr:function(J,G,K){" is no match for "}" part.
and (function(){ part too.
how should I put it?

Add new comment

Filtered HTML

  • Web page addresses and e-mail addresses turn into links automatically.
  • You may insert videos with [video:URL]
  • Allowed HTML tags: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd> <table> <tr> <td> <th> <img> <h1> <h2> <h3> <iframe> [video]
  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <asp>, <c>, <cpp>, <csharp>, <css>, <html4strict>, <java>, <javascript>, <mysql>, <php>, <python>, <sql>, <vb>, <vbnet>. The supported tag styles are: <foo>, [foo].
  • Lines and paragraphs break automatically.

Plain text

  • No HTML tags allowed.
  • Lines and paragraphs break automatically.
CAPTCHA
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.