By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,948 Members | 1,587 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,948 IT Pros & Developers. It's quick & easy.

count down timer - JavaScript inside Ajax not working

100+
P: 155
Hi all!

i got a countdown timer for auctions that runing.

i got a DIV that refreshs every 4 seconds
that DIV is refreshed by ajax ,the file that is refreshed is timer.php for example!!

my problem is that the timer.php is not showing up.
if i run the timer.php alone it is showing the timer ,the problem i think it's because the timer sits inside the ajax DIV and that is what i think making me the problem!!

any help please?


thanx :)
Dec 16 '08 #1
Share this Question
Share on Google+
22 Replies


Expert 100+
P: 392
There is really not any way to make any suggestions if you do not post the relevant code you are asking about.
Dec 17 '08 #2

100+
P: 155
my problem is that the javascript return from ajax is inside php file

the javascript is executed in php so the problem is the ECHO javascript ,that closeing the response!!

here is the code:

Expand|Select|Wrap|Line Numbers
  1. echo "<div id='$bid_id'></div>
  2. <script type=\"text/javascript\">
  3. var launchdate2=new cdLocalTime(\"$bid_id\", \"server-php\", 0, \"$exmonth $expdate[2], $expdate[0] ";
  4. if($expiretime=='0')
  5.     {echo "00:00:00";}
  6. else { echo $expiretime;}
  7. echo "\")
  8. launchdate2.displaycountdown(\"\", formatresults2)
  9. </script>";
  10. }   
  11. else // Show some other content
  12.         {
  13.         echo "<font color='#FF0000' size='3''>you can still bid</font>";
  14.  
  15.  
  16.         }
  17. ?>
the last echo is working if there is no time left ,if there is time left then it showing nothing.

i need help taking this javascript out of the php.

please help me with that!

thanx
Dec 18 '08 #3

acoder
Expert Mod 15k+
P: 16,027
You need to either eval the JavaScript or put the JavaScript code separately into the head of the calling page.
Dec 18 '08 #4

100+
P: 155
i need the javascript to be where it should be between the php script.

i dont understand all those slashes :(

any help with that?

thanx
Dec 18 '08 #5

acoder
Expert Mod 15k+
P: 16,027
Either have two separate requests: one for the HTML and the other for the JavaScript code; or parse the response to get the script to either eval or append to the head of the parent document. You don't necessarily need it where you currently have it because the ID should be enough for it to find where the timer should be displayed.
Dec 18 '08 #6

100+
P: 155
my problem is the ajax that look for the response from the div,
now the javascript is executed by echo ,so the ajax is taking just the script as respond

please help me take the javascript from the echo, there im stuck :(

thanx
Dec 18 '08 #7

acoder
Expert Mod 15k+
P: 16,027
If we take the split route, move lines 3-8 into their own mini script and call that separately. Then you can just eval the response.
Dec 18 '08 #8

100+
P: 155
here is the ajax code im using
Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript">
  2. function getXMLHttp()
  3. {
  4.  
  5. var xmlHttp;
  6.  
  7.   try
  8.   {
  9.     //Firefox, Opera 8.0+, Safari
  10.     xmlHttp = new XMLHttpRequest();
  11.   }
  12.   catch(e)
  13.   {
  14.     //Internet Explorer
  15.     try
  16.     {
  17.       xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
  18.     }
  19.     catch(e)
  20.     {
  21.       try
  22.       {
  23.         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  24.       }
  25.       catch(e)
  26.       {
  27.         alert("Your browser does not support AJAX!")
  28.         return false;
  29.       }
  30.     }
  31.   }
  32.   return xmlHttp;
  33. }
  34.  
  35.  var xmlHttp;
  36.  
  37. function MakeRequest2()
  38. {
  39.   var xmlHttp = getXMLHttp();
  40.  
  41.   xmlHttp.onreadystatechange = function()
  42.   {
  43.     if(xmlHttp.readyState == 4)
  44.     {
  45.       HandleResponse(xmlHttp.responseText);
  46.     }
  47.   }
  48. nocache = Math.random();
  49.   xmlHttp.open("GET", "check2.php?nocache="+nocache); 
  50.   xmlHttp.send(null);
  51.  setTimeout('MakeRequest2()', 4000);
  52. }
  53.  
  54. function MakeRequests()
  55. {
  56.   var xmlHttp = getXMLHttp();
  57.  
  58.   xmlHttp.onreadystatechange = function()
  59.   {
  60.     if(xmlHttp.readyState == 4) 
  61.  
  62.     {  
  63.       HandleResponsec(xmlHttp.responseText);
  64.     }
  65.   }
  66. nocache = Math.random();
  67.   xmlHttp.open("GET", "main.php?nocache="+nocache, true); 
  68.   xmlHttp.send(null);
  69. }
  70.  
  71. function HandleResponsec(res)
  72. {
  73.   document.getElementById('content').innerHTML = res;
  74. }
  75.  
  76.  
  77. function HandleResponse(response)
  78. {
  79.   if (document.getElementById('id').innerHTML == response)
  80.     {
  81.  
  82.  
  83.  
  84.     }
  85.  
  86. else if (document.getElementById('id').innerHTML = response)
  87.  
  88.     {
  89. MakeRequests();
  90.  
  91.     }
  92.  
  93.  
  94.  
  95. }
  96.  
  97.  
  98. window.onload=MakeRequest2();
  99.     </script>
the "content" div is empty if there is time left ,if there is no time left ,it writing me that there is no more time ,it's like the ajax is refusing to display the timer :)

what can be wrong with this?

thanx
Dec 18 '08 #9

acoder
Expert Mod 15k+
P: 16,027
For the JavaScript, you will need to eval, e.g.
Expand|Select|Wrap|Line Numbers
  1. eval(xmlHttp.responseText);
but this would be if the response is pure JavaScript. Alternatively, you can append to the head using something like:
Expand|Select|Wrap|Line Numbers
  1. var script = document.createElement("script");
  2. script.type="text/javascript";
  3. var txt = document.createTextNode(xmlHttp.responseText);
  4. script.appendChild(txt);
  5. document.getElementsByTagName("head")[0].appendChild(script);
This would be if you only had one line. If you return more than one line, you will need to split them up by newline and append the text nodes one by one.
Dec 19 '08 #10

100+
P: 155
like i said the main.php works fine if i run it alone ,i did succeed to take the javascript out of the php ,but it didnt change any thing !!

the problem is in the ajax script.


it's not displaying the timer ,it's just displaying if there is no time left!

thanx
Dec 19 '08 #11

acoder
Expert Mod 15k+
P: 16,027
What does check2.php do? You've missed the third parameter in open() and in the callback function HandleResponse(), the else is setting the innerHTML to the response.
Dec 19 '08 #12

100+
P: 155
this is a short check to the database to see if there is change in some thing.

if there is changes it will call the next call ,the main.php to refresh the results.

the main.php is sitting inside a DIV in my index.php

can you point me where there is something wrong in my ajax script?

thanx ;)
Dec 19 '08 #13

acoder
Expert Mod 15k+
P: 16,027
So, which one contains the JavaScript code? main.php? Have you got a test page that I can have a look at?
Dec 19 '08 #14

100+
P: 155
in index.php head ,there is the src of javascript.js

in javascript.js there is the call to two php files

check2.php checks for changes in the data base ,if there is changes it refeshes
the main.php that sit in the content DIV

בונקר מכרזים ,its the file im runing inside the ajax DIV that dont show me the count down timer. if i run this file alone it showing me the timer ,if it's inside the div it's not showing me!!

בונקר מכרזים it's my testing page that not showing me the timer.

thanx
Dec 19 '08 #15

100+
P: 155
in the header.php there is the source javascript for the timer. and in my test page there is the header twice just to be sure it is calling the source javascript for the timer
Dec 19 '08 #16

100+
P: 155
the ajax code:

Expand|Select|Wrap|Line Numbers
  1. function MakeRequests()
  2. {
  3.  
  4.  
  5.   var xmlHttp1 = getXMLHttp();
  6.  
  7.   xmlHttp1.onreadystatechange = function()
  8.   {
  9.     if(xmlHttp1.readyState == 4) 
  10.  
  11.     {  
  12.       HandleResponsec(xmlHttp1.responseText);
  13.     }
  14.   }
  15.  
  16. nocache = Math.random();
  17.   xmlHttp1.open("GET", "main.php?nocache="+nocache, null); 
  18.   xmlHttp1.send(null);
  19.  
  20. }
  21.  
  22. function HandleResponsec(res)
  23. {
  24.  
  25.   document.getElementById('content').innerHTML = res
  26. }

in the main.php there is javascript that is not working ,what i need to do so the javascript will run?

thanx
Dec 20 '08 #17

Expert 100+
P: 173
Is the innerHTML of the content element definitely being updated?

Have you tried to confirm that the code is running as expected by either debugging with a tool such as FireBug for Firefox or by inserting alerts at various points and making sure that they are hit?

If the document is XHMTL then certain browsers will not allow the innerHTML of an element already within the DOM to be changed incase it is not valid XHTML. If this is the problem it can be resolved by creating an element and setting that elements innerHTML before adding it to the document. To do this change the HandleResponsec function to:

Expand|Select|Wrap|Line Numbers
  1. function HandleResponsec(res)
  2.  {
  3.   -- declare variables.
  4.   var newElem, content;
  5.  
  6.   -- create element and set innerHTML.
  7.   newElem = document.createElement('div');
  8.   newElem.innerHTML = res;
  9.  
  10.   -- select the content element.
  11.   content = document.getElementById('content');
  12.  
  13.   -- Ensure that the content element has been found.
  14.   if(content !== null){
  15.     content.appendChild(newElem);
  16.   }
  17.  }
This example wraps the content in a div. If the result is plain text then you could create a text node and add this to the content element directly. This will encode an HTML entities so this must only for text:

Expand|Select|Wrap|Line Numbers
  1. function HandleResponsec(res)
  2.  {
  3.   -- declare variables.
  4.   var newText, content;
  5.  
  6.   -- create text node.
  7.   newText = document.createTextNode(res);
  8.  
  9.   -- select the content element.
  10.   content = document.getElementById('content');
  11.  
  12.   -- Ensure that the content element has been found.
  13.   if(content !== null){
  14.     content.appendChild(newText);
  15.   }
  16.  }
I have assumed that there is a call to the MakeRequests function and that the getXMLHttp function returns an xmlHttpRequest object.
Dec 20 '08 #18

100+
P: 155
if i run the main.php alone it is working well with the javascript in it.

the javascript is runing in php code ,here it's the javascript code:

Expand|Select|Wrap|Line Numbers
  1. echo "<div id='$bid_id'></div>
  2. <script type=\"text/javascript\">
  3. var launchdate2=new cdLocalTime(\"$bid_id\", \"server-php\", 0, \"$exmonth $expdate[2], $expdate[0] ";
  4. if($expiretime=='0')
  5.     {echo "00:00:00";}
  6. else { echo $expiretime;}
  7. echo "\")
  8. launchdate2.displaycountdown(\"\", formatresults2)
  9. </script>";
if im runing the all page ,then it's not working the javascript.

my code goes like that

index.php got javascript in the head ,the javascript is ajax script ,the return content is siting in a div 'content' ,in the content div the ajax is calling the main.php ,in the main.php there is the javascript that is not geting executed.

thanx alot!

im working on it for 5 days now and no success .
Dec 20 '08 #19

gits
Expert Mod 5K+
P: 5,390
in case the javascript is delivered during an ajax-request the script will not be executed unless you eval() the script explicitly. javascript code is typically evaled during page-load and with an ajax-call that is just avaoided. so you need to eval the script in the response callback explicitly do get it executed.

kind regards
Dec 22 '08 #20

acoder
Expert Mod 15k+
P: 16,027
Threads merged. Please do not double post.

Moderator.

PS. You've posted the link which should make it easier to debug. Not had the time to look at it yet.
Dec 22 '08 #21

100+
P: 155
in this topic i understand that my problem is not what i look for!

i discover that my problem is the javascript inside the ajax content div ,so my problem is the other topic ,when some one is going to have problem like this ,he will find it there and not here ,this topic is countdown timer!!

m i right?

;)
Dec 22 '08 #22

acoder
Expert Mod 15k+
P: 16,027
Well, the problem was established from about the third post, so it has been the JavaScript problem all along.

I notice from the link that you posted that MakeRequests is undefined. It seems you've changed the code from what you had earlier.

main.php is a whole lot of code which is totally unnecessary for this purpose. Move the JavaScript code that you need into its own file and add that to the parent page.
Dec 23 '08 #23

Post your reply

Sign in to post your reply or Sign up for a free account.