Jump to content


Photo

need help can get multiple instances to work!


  • Please log in to reply
7 replies to this topic

#1 jac.kock

jac.kock

    Advanced Member

  • Members
  • PipPipPip
  • 52 posts
  • Locationnetherland

Posted 15 January 2014 - 06:45 AM

hi all,

 

i'm not very good whit AJAX and i cant seem to get it to work properly :(

 

i have a ajax script that i use in my website and it works fine for one div to refresh, i want to edit the script so i can use it for more div's to refresh so i need to make it ready to more than 1 instance of the script.

 

now i have edit the script and now the both div's ( more in the future) refresh every second and not at the specified time's :(

 

i included both the original and edit script! Can some please help me to get it to work?

 

PHP to call the script:

<?php
?>
<style type="text/css">
.head-tr
{ 
border-color: #FF2A2A; 
} 

.head-td
{ 
border-width: 7px; 
border-style: outset;
border-color: #FF2A2A; 
}
</style>
<table width="200">
  <tr>
    <td valign="top" align="top" bgcolor="#BE1F1F">
	  <script type="text/javascript"><!-- // orginal script call
		refreshdiv(); // -->
	  </script>
	  <div id="shownews"></div>
	</td>  	
  </tr>
</table>

<table width="200">
  <tr>
    <td valign="top" align="top" bgcolor="#BE1F1F">
  <script type="text/javascript"><!-- // edited script call
refreshdiv(30,'mynews','table.php'); // -->
  </script>
  <div id="mynews"></div>
</td> 
  </tr>
</table>



Script orginal:

// Customise those settings
var seconds = 30;
var divid = "shownews";
var url = "table.php";

////////////////////////////////
//
// Refreshing the DIV
//
////////////////////////////////

function refreshdiv(){
// The XMLHttpRequest object
var xmlHttp;
try{
xmlHttp=new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
}
catch (e){
try{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
}
catch (e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){
alert("Your browser does not support AJAX.");
return false;
}
}
}

// Timestamp for preventing IE caching the GET request
fetch_unix_timestamp = function()
{
return parseInt(new Date().getTime().toString().substring(0, 10))
}

var timestamp = fetch_unix_timestamp();
var nocacheurl = url+"?t="+timestamp;

// The code...
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState==4){
document.getElementById(divid).innerHTML=xmlHttp.responseText;
setTimeout('refreshdiv()',seconds*1000);
}
}
xmlHttp.open("GET",nocacheurl,true);
xmlHttp.send(null);
}

// Start the refreshing process
var seconds;
window.onload = function startrefresh(){
setTimeout('refreshdiv()',seconds*1000);
}

Script edited:

// Customise those settings
////////////////////////////////
//
// Refreshing the DIV
//
////////////////////////////////

function refreshdiv(mysec,mydiv,myurl){
var seconds = mysec;
var divid = mydiv;
var url = myurl;

// The XMLHttpRequest object
var xmlHttp;
try{
xmlHttp=new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
}
catch (e){
try{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
}
catch (e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){
alert("Your browser does not support AJAX.");
return false;
}
}
}

// Timestamp for preventing IE caching the GET request
fetch_unix_timestamp = function()
{
return parseInt(new Date().getTime().toString().substring(0, 10))
}

var timestamp = fetch_unix_timestamp();
var nocacheurl = url+"?t="+timestamp;

// The code...
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState==4){
document.getElementById(divid).innerHTML=xmlHttp.responseText;
setTimeout(refreshdiv(mysec,mydiv,myurl),seconds*1000);
}
}
xmlHttp.open("GET",nocacheurl,true);
xmlHttp.send(null);
}

// Start the refreshing process
var seconds;
window.onload = function startrefresh(){
setTimeout(refreshdiv(mysec,mydiv,myurl),seconds*1000);
}

PHP witch shows the page:

<?php
if(file_exists("../../support/connect.dat"))    // user,pass and database file 
{ 
                include("../../support/connect.dat");                                   // database connection file 
} 
//################ connect to database ############## 
$link=mysql_connect($host, $user, $pass) or die(mysql_error()); 
mysql_select_db($data); 

$res='';
$res1='';
$sql="Select * from headlights where delete_tab='0' ORDER BY RAND() LIMIT 1"; // get only the none deleted! 
$res1=mysql_query($sql); 
$res=mysql_fetch_array($res1); 
$hltxt=$res["krant_item"];

if($hltxt=='')
{
  $hltxt="Geen nieuws items gevonden.";
}
?> 
<!-- show the selected one --> 
<table width="100%"> 
  <tr> 
    <td class="head-td" valign="top" align="top" bgcolor="#FF2A2A"> 
 	  <font color="white" size="6px">Nieuws:</font>
 	</td>
  </tr>
  <tr>
    <td class="head-td" height="150px" valign="top" align="top"> 
	   <font color="white"><? echo $hltxt; // show the none deleted item?></font> 
	</td>   
  </tr> 
</table>

thnx all!


jamie

Newbee (from holland)

#2 gristoi

gristoi

    Advanced Member

  • Members
  • PipPipPip
  • 809 posts

Posted 15 January 2014 - 10:31 AM

It is 2014 , not 2004. use Jquery to create multiple instances of ajax calls


To err is human... to really foul up requires the root password

#3 jac.kock

jac.kock

    Advanced Member

  • Members
  • PipPipPip
  • 52 posts
  • Locationnetherland

Posted 16 January 2014 - 04:52 AM

It is 2014 , not 2004. use Jquery to create multiple instances of ajax calls

 

hi,

 

so it is 2014 and this solves my problem, this is youre help???

I said i 'm not very good or good with this!

 

so please explain how i gonna solve this with 'Jquery' or how to implement this in the file?

 

all i need is one simple function to call trough out the website formthe div's i want to refresh and set a different refresh rate (seconds) to them!!

 

so please help me if tryed to change it for weeks and i can seem to get i right!

 

thnx


jamie

Newbee (from holland)

#4 kicken

kicken

    Wiser? Not exactly.

  • Gurus
  • 2,649 posts
  • LocationBonita, FL

Posted 16 January 2014 - 02:07 PM

so it is 2014 and this solves my problem, this is youre help???
I said i 'm not very good or good with this!

The point of the comment was that you should be using jQuery as it will simplify your ajax interactions greatly. For instance it has a simply .load method you can use to request a URL and drop it's contents into a div. 

You then just create timers for each of your divs that you want to refresh and call the .load function whenever the timer ticks.

Note that browsers will limit you to two concurrent requests typically. If you have a bunch of divs trying to refresh at the same time, you'll be better off scripting things so that you get all the data for each div in a single request. Otherwise some will be delayed until the others are finished.
Recycle your old CD's, don't trash them!
Did I help you out?  Feeling generous? I accept tips via Paypal or Bitcoin @ 14mDxaob8Jgdg52scDbvf3uaeR61tB2yC7

#5 jac.kock

jac.kock

    Advanced Member

  • Members
  • PipPipPip
  • 52 posts
  • Locationnetherland

Posted 16 January 2014 - 04:29 PM

The point of the comment was that you should be using jQuery as it will simplify your ajax interactions greatly. For instance it has a simply .load method you can use to request a URL and drop it's contents into a div. 

You then just create timers for each of your divs that you want to refresh and call the .load function whenever the timer ticks.

Note that browsers will limit you to two concurrent requests typically. If you have a bunch of divs trying to refresh at the same time, you'll be better off scripting things so that you get all the data for each div in a single request. Otherwise some will be delayed until the others are finished.

 

oke that i find logical, however i dont understand ajax and jquery very wel i understand it a bit im a newbee about those languages :| 

 

can you write the proper code for this and i understan wath you mean with the timer problems and thats no issue because the most times a div wil be refreshed is not at the same time's some take 30 sec some 5 min ect.

 

thnx for your fine answer and i'll hope that you will help me with the code!


jamie

Newbee (from holland)

#6 kicken

kicken

    Wiser? Not exactly.

  • Gurus
  • 2,649 posts
  • LocationBonita, FL

Posted 16 January 2014 - 06:25 PM

As a very simple example:
<script type="text/javascript">
//Wait til the document is ready before running our code.
//This is necessary to ensure all the dom elements exist.
//See: http://api.jquery.com/ready/
jQuery(function($){ 
   //Set a recurring timer that will trigger every 30 seconds.
   //See: https://developer.mozilla.org/en-US/docs/Web/API/Window.setInterval
   setInterval(function(){
      //Select the DIV we want to change the contents of
      var $target = $('#targetDiv');

      //Ask jQuery to load the given URL into the DIV's content area
      //The URL has to be local to your site, you cannot load something external
      //See: http://api.jquery.com/load/
      //And: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Same_origin_policy_for_JavaScript
      $target.load('yourUrl.php');
   }, 30000);
});
</script>
<div id="targetDiv"></div>
http://jsfiddle.net/jXLK8/1/
Recycle your old CD's, don't trash them!
Did I help you out?  Feeling generous? I accept tips via Paypal or Bitcoin @ 14mDxaob8Jgdg52scDbvf3uaeR61tB2yC7

#7 jac.kock

jac.kock

    Advanced Member

  • Members
  • PipPipPip
  • 52 posts
  • Locationnetherland

Posted 17 January 2014 - 06:49 AM

As a very simple example:


<script type="text/javascript">
//Wait til the document is ready before running our code.
//This is necessary to ensure all the dom elements exist.
//See: http://api.jquery.com/ready/
jQuery(function($){ 
   //Set a recurring timer that will trigger every 30 seconds.
   //See: https://developer.mozilla.org/en-US/docs/Web/API/Window.setInterval
   setInterval(function(){
      //Select the DIV we want to change the contents of
      var $target = $('#targetDiv');

      //Ask jQuery to load the given URL into the DIV's content area
      //The URL has to be local to your site, you cannot load something external
      //See: http://api.jquery.com/load/
      //And: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Same_origin_policy_for_JavaScript
      $target.load('yourUrl.php');
   }, 30000);
});
</script>
<div id="targetDiv"></div>
http://jsfiddle.net/jXLK8/1/

 

 

oke thnx i see what you mean now, but how do i call this function and how do i make this function universial to call and set 1. timers 2. file to load 3. div name to refresh?

 

thnx alot already:)


jamie

Newbee (from holland)

#8 jac.kock

jac.kock

    Advanced Member

  • Members
  • PipPipPip
  • 52 posts
  • Locationnetherland

Posted 21 January 2014 - 05:59 AM

oke thnx i see what you mean now, but how do i call this function and how do i make this function universial to call and set 1. timers 2. file to load 3. div name to refresh?

 

thnx alot already:)

 

 

Can some help me with this problem???

 

thnx all


jamie

Newbee (from holland)




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com