Sending realtime data to mysql?

Question

<textarea name="txtScript" id="word_count" cols="20" rows="20"></textarea>
Total word Count : <span id="display_count">0</span> words.

I want to send realtime data in display count span.

$(document).ready(function()
{
    var wordCounts = {};
    $("#word_count").keyup(function() {
        var matches = this.value.match(/\b/g);
        wordCounts[this.id] = matches ? matches.length / 2 : 0;
        var finalCount = 0;
        $.each(wordCounts, function(k, v) {
            finalCount += v;
        });
        $('#display_count').html(finalCount);
        am_cal(finalCount);
    }).keyup();
 });

Default value is "0". It counts when I add new words. How can I send the realtime data in span to MySQL?

What do you mean by _"send the realtime data in span to MySQL"_? Do you want to store the count in MySQL every time the user have added/removed a word? May I ask why? — M. Eriksson, Dec 12 '18 at 07:05
You must use Ajax to send a request to your PHP script. then update your MySQL table. — Alireza Fallah, Dec 12 '18 at 07:09

Michael Thompson · Answer 1 · 2023-05-27T14:10:16.907

If you want to send "real time" data to your client, you will want to use Ajax long polling. Your PHP script will check (maybe once per second) for changes in the database, and then you will send this to your client. Bare in mind that this can become very resource hungry. Also, bare in mind that it is not actually real time.

The theory would look something like this:

Client sends long poll request.
Every second, script reads MySQL database.
If certain conditions are met, script echoes out data (probably JSON encoded), followed by a blank line.
Javascript checks for new data and receives new line and uses the data accordingly.

I have recently put together an example of this, which you can see here (unfortunately you cannot update the data yourself... yet), and you can download and play with it here.

This way, you can begin to understand how Ajax Long polling works.

Also bare in mind that "real time" is a myth (even if you want to dive in to WebRTC, then you will have much faster response times, still not real time, and only exists between clients, is not applicable here).

You can also play with web sockets with the PHP library "Ratchet", which I myself have been learning over the past few days, but it is somewhat more difficult and probably also not what you are looking for unless you yourself are the server administrator, are prepared to run a PHP script full time (almost like a daemon).

Link for `Ajax long polling` is dead. Maybe this one? : https://stackoverflow.com/questions/38238603/what-is-the-proper-way-of-doing-long-polling-using-jquery-and-ajax — schmark, May 27 '23 at 06:13

score 0 · Answer 2 · answered Dec 12 '18 at 08:02

It is not a good idea to save data into database on every keyup event. You can save your data into database after blur event or something else. You need to send finalCount to server side to save it into MySql database. You can use jQuery.ajax().

    $.ajax({
        url     : '/path/to/save.php',
        type    : 'POST',
        data    : 'finalCount=' + finalCount,
        success : function( data ) {
                    //alert(data);
                  }
    });

In save.php you can access finalCount like following and save it into database:

$_POST['finalCount']

Sending realtime data to mysql?

2 Answers2