[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 320
  • Last Modified:

issue with jquery load functionality

i am in a problem where my page does not become editable unless and untill its all images and everthing does not appear. so to make that, i tried the image in one scenario to be load my an ajax call.

i just mad a small call like this

$("#refresh").html('<img src="/dummy.gif"'>');
$("#refresh").load('abc.cfm?id=#id#');
<div id="refresh"></div>

now the case is what i am trying page should separately and initially the dummy.gif should be shown and then a ajax call will be made immediately after it to load the actual image from the server which is taking time to show and display in the div.

just trying to separate the load taking image from actual page call so page should become editable while image could keep loading later.


but this approach is not working, as initially i load a page, it does not eve show an image nor it load the file

then i tried adding the setInterval function to the load method like this:

setInterval(function() {
           $("#refresh").load('abc.cfm?id=#id#');
},1000);

so by this it makes call every 1 sec and then it keeps on executing that specific code every one second. this approach works, but i am not sure if this is a feasible solution and it is making a call again and again, it will hit performance, so anyone can guide better

Thanks
0
Gurpreet Singh Randhawa
Asked:
Gurpreet Singh Randhawa
  • 2
  • 2
1 Solution
 
Gurvinder Pal SinghCommented:
did you tried this approach?

<script>
$(document).ready(function(){
    $("#refresh").load('abc.cfm?id=#id#');
});
</script>

<div id="refresh"><img src="/dummy.gif"'></div>
0
 
Gurpreet Singh RandhawaWeb DeveloperAuthor Commented:
btw document.ready is already defined at the top of the Page but that is for another jquery function, so do i need to declare again
0
 
Gurvinder Pal SinghCommented:
you don't have to declare it again, but simply call this jquery line in that document.ready() event

("#refresh").load('abc.cfm?id=#id#');

Idea is to make sure that element with id 'refresh' is loaded into the document before this jquery statement is executed
0
 
Gurpreet Singh RandhawaWeb DeveloperAuthor Commented:
well i have noticed few the document.ready is opening for some jquery functions and then it is closed, like in a page which is like a set of included page , some included pages have jquery, that has already declared document.ready but that closed it too

but also my concern is if i have 100 records the document.ready will run 100 times
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now