Partially refreshing site not working

Question

I am trying to refresh just a part of my website (the left part in which a list with topics appear), but it don't work for me. I get a very weird screen on that left part if I click the refresh button. The script I am using is this:

$(function() {
   $("#refresh").click(function(evt) {
      $(".bgleft").load("left.php")
      evt.preventDefault();
   })
})

The weird screen I am getting is a white blank screen with a random text on it (that does not exist). I don't understand why it is happening. For a live example: go to (edited out) and click on "refresh" at the left frame.

Edit:

The HTML snippet: <body class="bgleft">

Juris Vaiders · Accepted Answer · 2012-09-28T08:43:06.777

1

In left.php there are two lines of code which are showing theese characters.

for(var n = 1; n < 7; n++)
document.write(String.fromCharCode(Math.round(Math.random()*25)+97));

Try to remove them, it should help.

Also as sad in other answers send only contents of <body> in response because scripts are already included in the site.

edited Sep 28 '12 at 08:43

answered Sep 28 '12 at 08:32

Juris Vaiders

635
8
22

It should refresh if you remove theese lines. They have no common with refreshing the page. – Juris Vaiders Sep 28 '12 at 08:39

score 1 · Answer 2 · edited May 23 '17 at 10:24

1

It's generally not a good idea to send a complete HTML page when doing a partial update. If you look at what's produced by your left.php, it's the complete page (with <html> tags and everything) you use in your iframe.

Either create a page that only renders the body of the left.php and use that for partial update. Or look here for how to refresh an iframe.

PS: Framesets are hopelessly deprecated and really limiting in terms of design, dynamic/javascript functionality and future extensibility. Consider not using them...

edited May 23 '17 at 10:24

Community

1
1

answered Sep 28 '12 at 08:39

pap

27,064
6
41
46

I know that it isn't a very good idea, but for this kind of site it is better to use, I guessed. This is the html snippet by the way: – 1BJK903 Sep 28 '12 at 08:52
It's almost never "better" to use framesets. It's a deprecated technology (removed in HTML5), the DOM and javascript support is not consistent across browsers making them messy to work with. Scrollbar behavior is also inconsistent across browsers, making it difficult to create cross-browser compatible design plus a whole lot of other issues. But it's your site and you'll do it your way ;) – pap Sep 28 '12 at 08:57

Ghassan Elias · Answer 3 · 2012-09-28T09:08:51.537

0

How come you are loading the same page HTML, HEAD, BODY inside the current BODY tag?

$(function() {
    $("#refresh").click(function(evt) {
        evt.preventDefault();         
        $(window.top.window).find('frame[name=left]').reload();
    })
})

edited Sep 28 '12 at 09:08

answered Sep 28 '12 at 08:36

Ghassan Elias

2,213
1
14
17

so why don't you just refresh the frame with javascript? `location.reload();` – Ghassan Elias Sep 28 '12 at 09:02
That is an option, but I didn't want to use javascript and wanted to get it on click. I can use it anyway, that's true. – 1BJK903 Sep 28 '12 at 09:04
yes put it on click event! instead of `$(".bgleft").load("left.php")` – Ghassan Elias Sep 28 '12 at 09:06

score 0 · Answer 4 · answered Sep 28 '12 at 08:39

0

You should be only fetching the content to be updated, not the whole page. Currently, the whole page is being fetched including html, body and even script tags. The jQuery and other scripts are also being loaded again because of this. This can cause major problems later.

answered Sep 28 '12 at 08:39

Vishal

2,030
22
27

How can I fetch the content only? The script is in left.php which is only the left frame for as I know... – 1BJK903 Sep 28 '12 at 08:54

Partially refreshing site not working

4 Answers4