0

I have a html table with tasks and the last column is called "status". I need to do a simple thing, to track the status of each task with the usual way of an animating gif icon if its in progress or an ok check if its done.

I have done this in the past by calling a php script with $.ajax that it was refreshing itself every 1 minute. The script was a PHP script with one query that checked a boolean column. This approach was ok, but even then I knew that this was most probably the dumbest way to do something like this.

I am looking for a more robust way to do this and while I was searching I found this snippet

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
$.ajaxSetup({ cache: false }); // This part addresses an IE bug.  without it, IE will only load the first number and will never refresh
setInterval(function() {
$('#divToRefresh').load('/path/to/your/php/file/userCount.php');
}, 3000); // the "3000" here refers to the time to refresh the div.  it is in milliseconds.
});
</script>

Something like this could work but how do I stop this refresh if the task was actually finished? Something like "Gaurav Sharma" answer on this post is the way to go?

I am a newbie in Jquery so I would really love to know how would you do something like this, seems a common task so I hesitate to re-invent the wheel by writing 2 pages of code for something that can be done with 5 lines :-)

Community
  • 1
  • 1
George D.
  • 1,630
  • 4
  • 23
  • 41

2 Answers2

0
var interval = setInterval(function() {
    $('#divToRefresh').load('/path/to/your/php/file/userCount.php');
    if(somecondition){
        clearInterval(interval);
    }
}, 3000); // the "3000" here refers to the time to refresh the div.  it is in milliseconds.

calling clearInterval(interval) stops the repetition.

Asad Saeeduddin
  • 46,193
  • 6
  • 90
  • 139
  • the 'somecondition' can look in the DOM? For example it can be something like if($('#divtorefresh').text=='loading') {clearInterval(interval);} So I guess I am asking this, each time it refreshes the div it runs the if statement? – George D. Oct 27 '12 at 11:27
  • 1
    `somecondition can` be anything, so yes, you can use DOM based conditions. Also, yes, after refreshing the div it runs the check, but you can put this check anywhere in your script. The basic premise is that calling clearInterval with the original interval ID will stop it. – Asad Saeeduddin Oct 27 '12 at 11:29
  • I'll try this out. I have concerns how the code will look like if I have 10 tasks in the table tha runs this check. – George D. Oct 27 '12 at 11:40
  • I am trying this http://paste.laravel.com/8Dh but I got the error = "TypeError: $(".checkcampstatus").setInterval is not a function" – George D. Oct 27 '12 at 12:22
  • Is jQuery included? Also, is an element with class checkcampstatus in the markup? Your link just seems to contain a fragment of js. – Asad Saeeduddin Oct 27 '12 at 12:30
  • 1
    Additionally, setInterval is not a jQuery method. It is a method of the window. – Asad Saeeduddin Oct 27 '12 at 12:32
  • The problem was the chaining. Obviously setInterval can't be chained. – George D. Oct 27 '12 at 12:46
  • @GeorgeD. so is it fixed now? – Asad Saeeduddin Oct 27 '12 at 12:49
  • No. I'll keep trying, nothing is working as it should be so I'll make a restart and try again. – George D. Oct 27 '12 at 12:52
0

you should implement some code like this

var interval = null; // has to be global in this example

// [...] your code

interval = setInterval(function(...));

// [...] your code

if your script completes just call clearInterval(interval) from anywhere

bukart
  • 4,906
  • 2
  • 21
  • 40