Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p><strong>The Internet is Stateless</strong></p> <p>Anything done with JavaScript on the client side is not automatically remembered between page reloads due to the stateless nature of the internet. Submitting a form via post will result in a page reload so client-side changes are forgotten. To remember the changes made, the developer needs to specifically code a storage method.</p> <p><strong>Ajax</strong></p> <p>As you are using JavaScript and specifically jQuery already, an <a href="http://en.wikipedia.org/wiki/Ajax_%28programming%29" rel="nofollow noreferrer">ajax</a> call could be used to notify the server of the changes made client side.</p> <p>jQuery has an excellent <a href="http://api.jquery.com/jQuery.ajax/" rel="nofollow noreferrer">AJAX library</a>. Several tutorials are avalailable at the <a href="http://docs.jquery.com/Tutorials:AJAX_and_Events" rel="nofollow noreferrer">jQuery tutorials page</a>. There are also plenty of <a href="http://www.developertutorials.com/tutorials/ajax/getting-started-with-ajax-in-jquery-8-05-11/page1.html" rel="nofollow noreferrer">web pages devoted to the subject</a>.</p> <p><strong>Ajax example using jQuery</strong></p> <p>As a simple example, when you add the extra row you could call an ajax function such as:</p> <pre><code>$.ajax({ url: 'ajax/add_row.html?user_id=100&amp;data=new-data', success: function(data) { alert('Adding of the row was acknowledged.'); } }); </code></pre> <p><strong>Server side</strong></p> <p>On the server side, you simply need a page located at ajax/add_row.html to do a little bit of work, taking the data passed to it and adding it to the database. On the next page reload, the added data can be put onto the page as usual.</p> <p>In reality, if your data is more complex than this, it may be better to send the data to the script via the post method.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload