0
 <script>
        setInterval(function(){
            $.ajaxSetup({ cache: false });
        $('#scrip-data').load(location.href + " #scrip-data");
        }, 30 * 1000);
    </script>

I am trying to reload a div without reloading the page.One thing I noticed the size of the layout getting smaller even the letters. Data I am getting from database. Its working fine except the page render which can be ignored but I want to fix this issue

Any help will be appreciated

Siba Swain
  • 93
  • 7
  • Try looking at this post: https://stackoverflow.com/questions/18490026/refresh-reload-the-content-in-div-using-jquery-ajax – Juan C Aug 30 '21 at 16:39
  • Between the **"** and the **#scrip-data** you have a space. So the URL is look like this `https://myUrl.com_#scrip-data` replace the _ by a space – Patfreeze Aug 30 '21 at 16:39

2 Answers2

1

It looks like you're trying to reload the html of that Div every 30s.

One thing that might be happening is that the jquery you posted here replaces the target div' (#scrip-data) internals with the loaded html.

What is likely happening is you might have divs inside each other. From the jQuery docs:

"This element, along with its contents, is inserted into the element with an ID of result, and the rest of the retrieved document is discarded."

So you might have multiple "#scrip-data" divs after this code runs.

Brenn
  • 1,364
  • 1
  • 12
  • 22
  • 1
    Yes that what happening. everytime the reload happening its putting divs inside another and so on. And since I am using bootstrap its affecting the schemas.May be I need to recreate the table in html after I get the data from each request. – Siba Swain Aug 30 '21 at 16:59
1

To refresh a div, you can do like this

<script> 
$(document).ready(function(){
setInterval(function(){
      $("#here").load(window.location.href + " #here" );
}, 10000);
});
</script>

<div id="here">dynamic content ?</div>

The div reloads automatically every 10 seconds.

mvetois
  • 111
  • 11