Home/ Questions/Q 9010837
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-16T02:34:06+00:00

I create a chat function. here if i write something then it show on

  • 0

I create a chat function. here if i write something then it show on chat div. But my problem is if i write again then second message replace on first message. I want to show all message on chat div. Like chat

test.php

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Dhuronto</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
 $('#message').keydown(function (e){
    if(e.keyCode == 13 ){
if($(this).val()!=0)
    {
    e.preventDefault();//use this to prevent default behavior
    calculate();
    }
   }
   });
});

function calculate()
{
$.post(
"test_1.php",
$('#message').serialize(),
function(response)
{
$("#chat").html(response);
});
$('#message').val("");
}



</script>
</head>
    <body>
    <div id="chat" style=" width: 300px; height: 500px; border: 1px solid black; overflow: auto">

        </div>
        <textarea id="message" name="chat_message"></textarea>
    </body>
</html>

test_1.php

<?php

$message=$_POST['chat_message'];

echo "$message";

?>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Use append instead. html replaces all content.

    $.post("test_1.php", $('#message').serialize(), function(response) {
    $("#chat").append($message.val() + '<br/>')
              .scrollTop($('#chat')[0].scrollHeight);
});

    You can add a line break after each message, this they will be in a new line.
    And use scrollTop to make the scroll down after enter a new message.

    demo

    • 0