Refresh multiple div's - javascript

I'm using the following code to get data refreshed every 2 seconds in 2 different div's
<script type="text/javascript">
function refreshTable(divId, typeId, serverDesc){
$.get('getServerData.php?vTypeId=' + $(typeId).val() + '&vServerDesc=' + $(serverDesc).val(), function(data){
$(divId).html(data);
window.setTimeout(refreshTable, 2000)})
}
$(document).ready(function(){
refreshTable("#Servers1", "#hdnTypeId1", "#hdnServerDesc1");
refreshTable("#Servers2", "#hdnTypeId2", "#hdnServerDesc2");
});
</script>
I'm getting the correct data for the different div's but the refresh is not working.
In the hdnTypeId fields and hdnServerDesc fields the correct data is passed through but the refresh is not working.

your are making a callback to refreshTable without parameters, change
window.setTimeout(refreshTable, 2000)
to
window.setTimeout(function(){refreshTable(divId,typeId,serverDesc);}, 2000)

You can pass a function as the first parameter to window.setTimeout like this:
<script type="text/javascript">
function refreshTable(divId, typeId, serverDesc){
$.get('getServerData.php?vTypeId=' + $(typeId).val() + '&vServerDesc=' + $(serverDesc).val(), function(data){
$(divId).html(data);
window.setTimeout(function() {
refreshTable(divId, typeId, serverDesc);
}, 2000)})
}
$(document).ready(function(){
refreshTable("#Servers1", "#hdnTypeId1", "#hdnServerDesc1");
refreshTable("#Servers2", "#hdnTypeId2", "#hdnServerDesc2");
});
</script>

Related

How to reload a div content automatically

I need that only the content of the div "chat_scroll" are automatically reloaded. I've tried a lot of codes, but the div remains stationary.
At last, I've tried with this:
JS before
<script>
function updateDiv()
{
$( "#chat_scroll" ).load(window.location.href + " #chat_scroll" );
}
</script>
JQUERY at the bottom of the file:
<script>
function myFunction() {
myVar = setInterval(updateDiv(), 3000);
}
</script>
setInterval accepts a function as an argument:
setInterval(updateDiv, 3000);
Note that there's no () after updateDiv. That would be calling the function, and passing its return value to setInterval, which is not what you're trying to do.
When do you call myFunction()? Try this instead of using myFunction:
$(document).ready(function(){
setInterval(function(){
updateDiv();
}, 3000);
});

JQuery code working properly in jsfiddle but not in browser even with $(window).load(function())

So I'm trying to make a search using a dropdown list, which will show/hide some checkboxes depending on the chosen answer. The problem is that it works perfectly on jsfiddle.net but refuses to load properly on my local machine. I saw a similar post and said something about adding $(window).load(function()) before the rest of the script, but even then it refused to work. I might be doing something wrong so any help is appreciated.
The link for jsfiddle is this: http://jsfiddle.net/CDyZf/66/
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script>
$(window).load(function());
$('.drop-down-show-hide').hide();
$('#dropDown').change(function () {
$(this).find("option").each(function () {
$('#' + this.value).hide();
});
$('#' + this.value).show();
});
</script>
The argument of load() needs to be a function.
load(function()) would pass it the return value of calling a function called function, if function wasn't a reserved word making it a error.
function init() {
$('.drop-down-show-hide').hide();
$('#dropDown').change(function () {
$(this).find("option").each(function () {
$('#' + this.value).hide();
});
$('#' + this.value).show();
}
$(window).load( init );

jQuery reload image depending on variable

I have two images img0.png and img1.png. I want to reload image depending on bool variable.
I tried
<script type="text/javascript">
$(document).ready(function(){
$.ajaxSetup({ cache: false });
setInterval(function() {
d = new Date();
$("#abc1").attr("src", "images/img:="status":.png?"+d.getTime());
},1000);
});
</script>
where :="status": is bool variable I get from PLC.
It is necessary to reload whole page to refresh image when bool variable changes. Is it possible to reload it without refresh?
EDIT:
Problem solved.
setInterval(function() {
$.get("variable.htm", function(result){
$("#abc1").attr("src", "images/img" + result + ".png");
});
},1000);
where variable.htm contains :="status": only.
Thanks for comments.

jQuery .css sometimes doesn't work

How can I fix problem with jQuery function ".css" which works only when it is triggred by user (console, button, ...) ?
I'm using interval in .ready function for trigger it but it dosn't work. However .html function is changing the text properly.
$(document).ready(function()
{
setInterval(function()
{
$.get("./getData", function(data)
{
$(".text").html("" + data + " %");
$(".circle").css("border-width", "" + data + "px");
});
}, 1000);
});
Other border properties specified properly? Border color and weight? Its working fine when specified.
Your code looks fine, make sure data is numeric value and you have element with class name circle
jsFiddle
Try to call this function on window.onload.
<script>
function testFunction()
{
setInterval(function()
{
$.get("./getData", function(data)
{
$(".text").html("" + data + " %");
$(".circle").css("border-width", "" + data + "px");
});
}, 1000);
}
window.onload=testFunction;
</script>

problems with jquery load()

I need a certain div refreshed on the page every 3 seconds. This div contains other divs inside it.
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
setInterval(function()
{
$('#gamewrapper2').load('find.php #gamewrapper2');
}, 3000);
;
This code works but only if the page visited is domain/find.php and it doesn't work for domain/find.php?id=1000001
Maybe i don't understand something but shouldn't this function load take the block #gamewrapper2 from find.php and paste it into the block #gamewrapper2 of the current page?
Do you just need to keep the query string on find.php? Something like:
setInterval(function(){
$('#gamewrapper2').load(window.location.pathname + window.location.search + ' #gamewrapper2');
}, 3000);
You can try the following to pass variables into the php document:
setInterval(function()
{
$('#gamewrapper2').load('find.php #gamewrapper2', {id: 1000001});
}, 3000);
}
Additionally, you can provide a function callback when it has completed loading to perform some task...
setInterval(function()
{
$('#gamewrapper2').load('find.php #gamewrapper2', {id: 1000001}, function(){
alert("find.php has been loaded.");
});
}, 3000);
}
.load() method
You should probably use $_POST['id'] to get the value from find.php.

Categories