Periodically refreshing the table view without reloading the page

Got something cool to share with AppGini users? Feel free to post it here!
Post Reply
User avatar
a.gneady
Site Admin
Posts: 1280
Joined: 2012-09-27 14:46
Contact:

Periodically refreshing the table view without reloading the page

Post by a.gneady » 2018-10-14 14:51

An AppGini user sent me an interesting question, and I wanted to share the answer here. Here is his question:
I need to refresh the table view, but without blinking, as currently setInterval is very anoying. Is there any way to AJAX load the table view, or do you have any suggestion (Use case : the table view is used on a big screen, there is 5 tablets who "post" to the big screen. so everytime somebody insert a new record it is visible on the big screen.)
A very simple solution is to use jQuery .load() method ... Add the following code to the hooks/tablename-tv.js file (where tablename is the name of the concerned table -- create the file if it doesn't already exist in hooks):

Code: Select all

$j(function(){
    setInterval(function(){
        $j('table').parent().load('tablename_view.php table');
    }, 10000);
})
Replace tablename in the above code with the actual name of the table, and optionally change 10000 to the number of milliseconds between reloads -- or leave it to reload the table every 10 seconds. This will update the table with any new records every 10 seconds without reloading the whole page or flickering the screen.
:idea: AppGini plugins to add more power to your apps:
  • DataTalk is an innovative AppGini plugin based on ChatGPT that allows you to interact with your AppGini database using natural language questions, without writing any SQL. Check the demo video
  • Mass Update plugin: Update multiple records at once and improve your workflow efficiency.
  • Check our other plugins and get a generous discount of up to 30% when buying 2 or more plugins.

User avatar
a.gneady
Site Admin
Posts: 1280
Joined: 2012-09-27 14:46
Contact:

Re: Periodically refreshing the table view without reloading the page

Post by a.gneady » 2018-10-15 17:47

Update: Let's say you want to perform some operation after reloading the table view (for example, highlight rows or cells matching some criteria), you could pass a callback function as the 2nd parameter to load() as shown below:

Code: Select all

$j(function(){
    setInterval(function(){
        $j('table').parent().load('tablename_view.php table', function(){
        	// do something after reloading the table view
        });
    }, 10000);
})
One last thing. If you wish to apply some filter(s), sorting, .. etc, you could modify the link you're loading by adding one or more parameters. For example:

Code: Select all

$j(function(){
    setInterval(function(){
        $j('table').parent().load('tablename_view.php?SortField=5&SortDirection=desc table', function(){
        	// do something after reloading the table view
        });
    }, 10000);
})
For a detailed explanation of accepted URL parameters, please see https://bigprof.com/appgini/help/advanc ... parameters
:idea: AppGini plugins to add more power to your apps:
  • DataTalk is an innovative AppGini plugin based on ChatGPT that allows you to interact with your AppGini database using natural language questions, without writing any SQL. Check the demo video
  • Mass Update plugin: Update multiple records at once and improve your workflow efficiency.
  • Check our other plugins and get a generous discount of up to 30% when buying 2 or more plugins.

User avatar
dnaorem
Posts: 19
Joined: 2018-10-16 16:06
Location: Imphal, Manipur, India
Contact:

Re: Periodically refreshing the table view without reloading the page

Post by dnaorem » 2018-11-03 15:38

Fantastic!
Thanks Ahmad sir,
This is very useful. :D

With regard,
Debenkumar Naorem
With regard,
Debenkumar Naorem

G Belgrado
Veteran Member
Posts: 61
Joined: 2017-03-12 09:24

Re: Periodically refreshing the table view without reloading the page

Post by G Belgrado » 2019-05-29 08:05

I have a problem.
The function works perfectly with the table, but if you open the form to insert a new record or modify a record, clicking on a datetime picker field, after the seconds elapsed for the refresh, the table appears instead of the datetime picker and the form is emptied

User avatar
a.gneady
Site Admin
Posts: 1280
Joined: 2012-09-27 14:46
Contact:

Re: Periodically refreshing the table view without reloading the page

Post by a.gneady » 2019-05-30 15:56

Well .. seems the datepicker is using an HTML table, and thus the refresh code selects it incorrectly. So the fix is to make the selector more specific .. So, instead of:

Code: Select all

$j('table')
Try:

Code: Select all

$j('.table_view table')
:idea: AppGini plugins to add more power to your apps:
  • DataTalk is an innovative AppGini plugin based on ChatGPT that allows you to interact with your AppGini database using natural language questions, without writing any SQL. Check the demo video
  • Mass Update plugin: Update multiple records at once and improve your workflow efficiency.
  • Check our other plugins and get a generous discount of up to 30% when buying 2 or more plugins.

G Belgrado
Veteran Member
Posts: 61
Joined: 2017-03-12 09:24

Re: Periodically refreshing the table view without reloading the page

Post by G Belgrado » 2019-05-30 17:13

It works perfectly now
thank you so much
Ahmed

aborneo
Posts: 2
Joined: 2020-04-15 18:39

Re: Periodically refreshing the table view without reloading the page

Post by aborneo » 2020-04-26 05:28

Hi, I would like to know how to apply this in detail view in order to update stock quantity balance by not refresh page manually.
Thank you.

User avatar
D Oliveira
AppGini Super Hero
AppGini Super Hero
Posts: 347
Joined: 2018-03-04 09:30
Location: Orlando, FL

Re: Periodically refreshing the table view without reloading the page

Post by D Oliveira » 2020-04-28 16:45

This is amazing in so many levels... thanks for that!

Post Reply