Using Java Script to Transfer Data

How to transfer data from client to server?

I have a very simple text editor set up on a site and every few minutes I would like to send information that was entered back to the server as a text file. I am trying to create an effect similar to the googleWave live type.

Speed ​​and efficiency are not that important at the moment. Quick and dirty would be enough.

+2


a source to share


4 answers


Have a look at Ajax . Or a Simple Example .

From Wikipedia :



With Ajax, web applications can fetch data from the server asynchronously in the background without interfering with the display and behavior of the existing page. The use of Ajax techniques has led to an increase in interactive or dynamic interfaces on web pages.

+1


a source


You are going to use AJAX for this. Also, you just need to start a JavaScript timer using setInterval, which would set the delay between saves. When the delay interval is reached, an AJAX call will be made that will pass the current value of the text editor.



+1


a source


You can also look into timer recording of data in localStorage (if the browser supports it)

+1


a source


This technology is called AJAX . It's just that AJAX allows you to make an HTTP request in javascript. When executed asynchronously, the request is processed in the background (on its own thread), and upon completion, the callback function you specified is executed.

While it's always good to know how to do it all through the browser's native API, javascript libraries like the popular jQuery save have a lot of lines of code. Sample code:

var editor = $('#editor');

/* Hijack regular form submission and send the data via AJAX
   by listening 'submit' event. */
editor.submit(function() {
    $.post(editor.attr('action'), editor.serialize(), function() {
        // code to be executed after successfull request
    });
    return false;
});

/* Auto-submit the form once per minute by firing 'submit' event. */
setInterval(function() {
    editor.submit();
}, 1000 * 60);

      

HTML:

<form id="editor" action="/path/to/your/save/handler" method="post">
    <fieldset>
        <textarea name="content" cols="70" rows="30"></textarea>
        <button type="submit">Save</button>
    </fieldset>
</form>

      

0


a source







All Articles