CODEWITHSUNDEEP
jqueryhtmlrefresh
bmaynard06
bmaynard06

Reputation: 1

Refresh DIV using JQuery w/o need for PHP

What i'm looking to do is refresh a few DIV's, but not the whole page. But the catch is my application is with a Industrial Automation Programmable Logic Controller (PLC) with a built in web server. So I do not need to replace the data within the DIV, I just need to refresh it, as the PLC automatically updates the variable, but I need to refresh it on the html page.

Below is the current javascript I was using (from doing some research online). I was unsure if I needed ".load() in there, since all that i have seen load a PHP file in there

<script type="text/javascript" src="jquery-1.10.2.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function()
{
$('#station_num').fadeOut('slow').fadeIn('slow');
},1000);
</script>

The DIV looks like below:

<div id="station_num"><h1>Station :="HMI_Control".StationNum:</h1></div>

-the :="HMI_Control".StationNum is a variable from the PLC

So I was able to see the variable flashing (from the fade in/fade out), but the variable wasn't updating on the website (although I can monitor the variable in the PLC and see it change).

Any help would be appreciated!

Upvotes: 0

Views: 392

Answers (2)

Marco Marsala
Marco Marsala

Reputation: 2462

$('#station_num').fadeOut('slow').fadeIn('slow'); won't update anything. It will just hide then show again the same content.

Use this:

$('#station_num").html('<h1>Station :="HMI_Control".StationNum:</h1>');

This will set again the content of the div.

Upvotes: 1

DevlshOne
DevlshOne

Reputation: 8457

var auto_refresh = setInterval( function()
{
    $('#station_num')
        .fadeOut('slow')
        .html('<h1>Station :="HMI_Control".StationNum:</h1>')
        .fadeIn('slow');
},1000);

Upvotes: 1

Related Questions