Solved

Simple "slide show" suddenly skips several "slides" after a couple of run throughs

Posted on 2014-12-16
14
115 Views
Last Modified: 2014-12-16
This is not actually a slide show in the accepted sense, but has a similar effect.

I have the following code to change the content of a div at regular intervals

<script type="text/javascript">
setInterval("refreshBlock()",20000);
    $.ajaxSetup({ cache: false });
    function refreshBlock()
    {      
       $('#content_block').load("ChangedContent.cfm");
     }
</script>

The code works fine, but after cycling through the content pages a couple of times (25 pages), every so often it will flick through 3 or 4 pages in rapid succession, then settle down again and stick to the 20 seconds per page for a while.

Any ideas why this is happening, and any way to stop the erratic behaviour?
0
Comment
Question by:jdthedj
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 7
14 Comments
 
LVL 43

Expert Comment

by:Rob
ID: 40503781
It will be a timing issue between the ajax and the setInterval call.  Can't be sure without seeing your full code.  Do you have the jquery dom ready call or do you just put that script at the bottom of your page?
0
 
LVL 3

Author Comment

by:jdthedj
ID: 40503819
Thanks for the reply Rob

The ready call and the code above are in the head of the document, then at the bottom of the page a query creates a list of page urls, then a session variable is set to zero.  This code follows

<DIV id="content_block" style="width:auto;height:auto;overflow:auto;">
<cfinclude template="ChangedContent.cfm">
</div>

At the top of the included page the session variable is increased by one, and the Url to include is read from the url list and the page the url points to is included in the ChangedContent page.
0
 
LVL 43

Expert Comment

by:Rob
ID: 40503876
this code:

setInterval("refreshBlock()",20000);
    $.ajaxSetup({ cache: false }); 

Open in new window


needs to be in your ready call
e.g.
$(function() {
setInterval("refreshBlock()",20000);
    $.ajaxSetup({ cache: false }); 
});

Open in new window

0
Guide to Performance: Optimization & Monitoring

Nowadays, monitoring is a mixture of tools, systems, and codes—making it a very complex process. And with this complexity, comes variables for failure. Get DZone’s new Guide to Performance to learn how to proactively find these variables and solve them before a disruption occurs.

 
LVL 3

Author Comment

by:jdthedj
ID: 40503905
Thanks Rob - but that doesn't work.  It stays on the first page forever
0
 
LVL 43

Expert Comment

by:Rob
ID: 40503916
ok, while i see it, I often use closure with setInterval, rather than passing a string for the function;

i.e.
change:
setInterval("refreshBlock()",20000);

to:
setInterval(function() { refreshBlock(); },20000);

This removes the use of eval() and removes the possibility that the function can be executed both in the setInterval and in its initialisation.

This should work within the $(function() { ... }); so given that it doesn't means there is something else amiss in the page or the order the scripts are loaded is playing a part but that's hard to know without seeing your page's full rendered html code or a link to the site.
0
 
LVL 3

Author Comment

by:jdthedj
ID: 40503936
OK Rob - I have uploaded to the website.  the url is

http://www.advancedpersonnel.co.nz/a/job_posting_Display.cfm

As mentioned, now only the first page displays continuously.
0
 
LVL 43

Accepted Solution

by:
Rob earned 500 total points
ID: 40503943
yep, was just a simple issue and I didn't say, just assumed, because $(function() {...}); is exactly the same as $(document).ready(function() {...});

your code should be:

<script type="text/javascript">

$(function() {
setInterval(function() {refreshBlock();},20000);
    $.ajaxSetup({ cache: false });     
});

 function refreshBlock()
    {    
       $('#block1').load("ChangedContent.cfm"); 
     }
</script>

Open in new window

0
 
LVL 3

Author Comment

by:jdthedj
ID: 40503957
Thanks Rob - that's great - working now thanks.  I'll leave this open a while and leave the code running in case it starts skipping again, then I'll come back to you.
0
 
LVL 43

Expert Comment

by:Rob
ID: 40503972
Sounds good.  you should probably see something in the next 10 minutes or so right?
0
 
LVL 3

Author Comment

by:jdthedj
ID: 40503973
Yes, that would be correct
0
 
LVL 3

Author Comment

by:jdthedj
ID: 40503977
Looks like it has gone round the loop once and stopped
0
 
LVL 43

Expert Comment

by:Rob
ID: 40503982
yep.  at the end of the show, your cfm script must be sending a header to redirect to Job_Posting_Display.cfm
0
 
LVL 3

Author Closing Comment

by:jdthedj
ID: 40503985
OK looks like it's all go!  Thanks very much for all your help
0
 
LVL 43

Expert Comment

by:Rob
ID: 40503990
No problem. :)  Thanks for the points.
0

Featured Post

MS Dynamics Made Instantly Simpler

Make Your Microsoft Dynamics Investment Count  & Drastically Decrease Training Time by Providing Intuitive Step-By-Step WalkThru Tutorials.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Javascript Regex 7 20
javascript works in Chrome, but none of the other browsers 14 38
Problem in javascript 17 32
GitHub 1 13
PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

696 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question