Change innerHTML from an external php file

Question

I've got a script in an HTML file that runs a php file every 30 seconds. The php file is intended to change a div's innerHTML. I don't seem to find the way to replace it.

I was using load() but there are several divs I want to keep updating every 30 seconds and I don't want to make the server GET that much requests. So I'm looking for one only php get and then change the innerhtml in those several divs

This is what i've got:

HTML:

<script type="text/javascript">
$(document).ready(function () {
    $.get('php.php');
});
setInterval(function(){
    $.get('php.php');
}, 30000);
</script>

<div id="foo"></div>

php.php:

document.getElementById("foo").innerHTML = '<?php
// some php code
 ?>';

I think the problem is I'm not being able to get the element from the parent HTML file. I don't know how to solve this... Any suggestions will be more than aprecciated!

epascarello · Accepted Answer · 2013-05-14 04:15:05Z

2

You are reinventing jQuery's load()

function fetchContent() {
     $("#foo").load('php.php');
     window.setTimeout(fetchContent, 30000);
}
$(fetchContent);

The server should just return the HTML content that you want to display.

EDIT

Since your comment is different from the original question.

function fetchContent() {
     $("#foo").get('php.php', function(data) {
         var html = $("<div/>").html(data);             
         $("#foo").html( html.find("#Section1").html() );
         $("#bar").html( html.find("#Section2").html() );
         $("#asd").html( html.find("#Section3").html() );
         window.setTimeout(fetchContent, 30000);
     });
}
$(fetchContent);

You would want to add an onError handler and might want to set the no cache option for the Ajax calls.

edited May 14, 2013 at 4:15

answered May 14, 2013 at 4:04

epascarello

208k20 gold badges206 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

fpolloa Over a year ago

Kind of... I was using load() but there are several divs I want to keep updating every 30 seconds and I don't want to make the server GET that much requests. So I'm looking for one only php get and then change the innerhtml in those several divs

epascarello Over a year ago

It would help if that was in your info from the start!

nbsp · Accepted Answer · 2013-05-14 03:49:47Z

1

what you probably want is for your php.php to return some data, and then you use the success of the $.get to update your #foo; taking an example from http://api.jquery.com/jQuery.get/ and modifying it for your example

$.get("php.php", function( data ) {
    $( '#foo' ).html( data );
});

hope that helps :)

answered May 14, 2013 at 3:49

nbsp

2,2911 gold badge15 silver badges12 bronze badges

4 Comments

fpolloa Over a year ago

I can't quite understand what you say... I'm knew to coding. I'm trying to print the following inside the div

document.getElementById("foo").innerHTML = '<? $line1= file_get_contents('example/foo.txt'); print htmlentities($line1);?>';

fpolloa Over a year ago

I don't know how to export the data $line1 to use in the function

fpolloa Over a year ago

I updated the question with more information about my problem. Maybe now you can help me? ;)

nbsp Over a year ago

Sorry for not replying, I was offline shortly after putting an answer, my bad.

Collectives™ on Stack Overflow

Change innerHTML from an external php file

2 Answers 2

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related