Webserver other clients cannot see the changes

Hi everyone, I’m building a chatbox using arduino uno. I’m just a beginner so if please answer the question like you’re talking with a dummy. So my question is simple. I can open up a .htm file and using js I can add the comments of the client to the chatbox. However, they can not see the changes made in the chatbox. I do not know much but it looks like ajax is something I can use to solve this. I am open to any suggestion. I uploaded the script, html and the code I uploaded to my arduino uno. (arduino code is not mine I found it online.)

var main = function () {
    
    $('form').submit(function () {
        var comment = $("#comment").val();
        
        if (comment !== "") {
            $(".commentbox").append("\r\n");
            $(".commentbox").append(comment);
            $("#comment").val("");
            var myDiv = document.getElementById("chatbox");
            myDiv.scrollTop = myDiv.scrollHeight;
            
        }

        return false;
    });

    
    


};

$(document).ready(main);
<!doctype html>
<html>
<head>
    <title>Arduino Messsage Board</title>
    <link rel='stylesheet' href='style.css' />
    <meta charset="utf-8">
</head>
<body>

    <div class="header">
        <div class="container">
            <h1>Arduino Based Message Board</h1>
            
        </div>
    </div>

    <div class="main">
        <div class="container">

            <textarea readonly id ="chatbox" class="commentbox"></textarea>

            <form>
                <input id="comment" type="text" placeholder="share your thoughts">
                <button class="btn">Post</button>
            </form>
            

        </div>
    </div>



    <script src="jquery.js"></script>
    <script src='script.js'></script>
    
</body>
</html>

WebserverCode.ino (6.12 KB)

It appears, from the code you have supplied, that the web clients make a request in some format (including a file name and type) to your web server. The web server then validates the request and returns the requested static file from the SD card to the client.

Since the file on the SD card is not changed, the web clients always receive the same file.

If you want the web clients to see new information, you will have to work out a way of submitting that new information to the web server, storing it, and making it visible in the web page which is served up to the clients.

You can dynamically edit the web page which the clients see or you can embed a request in java script in the web page served to the client which, when loaded, fetches the new data from the server. There are probably many other ways of doing this also.

6v6gt:
It appears, from the code you have supplied, that the web clients make a request in some format (including a file name and type) to your web server.
The web server then validates the request and returns the requested static file from the SD card to the client.

Since the file on the SD card is not changed, the web clients always receive the same file.

If you want the web clients to see new information, you will have to work out a way of submitting that new information to the web server, storing it, and making it visible in the web page which is served up to the clients.

You can dynamically edit the web page which the clients see or you can embed a request in java script in the web page served to the client which, when loaded, fetches the new data from the server. There are probably many other ways of doing this also.

So, every time I change something in html file I have to close it and reopen it? If so, doesn’t that cause refresh in others browser?

If so, doesn't that cause refresh in others browser?

No. No browser knows what the server is doing once the server has responded to the client's request.

berkeb: So, every time I change something in html file I have to close it and reopen it? . . .

Unless I have missed something, you are not updating the HTML that the web server is, well, serving. The java script routines appear to act purely in the browser client of the user, and so the results of any activities there are not returned to the server and are thus invisible to the other users. Or are you, in some code which you have not shown, changing the HTML file ? If you are, and these changes are still not visible afterwards to the users, you should then suspect that the HTML is not handling browser caching correctly. If you open an SD card file for writing, you must close it and reopen it for reading if you want to see the changes. See this example.