Tech boy Posted March 12, 2012 Share Posted March 12, 2012 Hi I am writing my first AJAX page I am not using a library at the moment I just having a look at things and trying to learn. The page I am building is a dummy factory info board showing how many units have been built so far in the day. I have a button on my page at the moment this will be replaced by a timer event, the first time this button is pressed the everything works great and I get a value but when I press the button again the on click event doesn't fire. I am thinking I am missing something obvious or is their anything but AJAX programming that would stop the event happening? thanks Tech boy Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/ Share on other sites More sharing options...
trq Posted March 12, 2012 Share Posted March 12, 2012 Post the relevant code. Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/#findComment-1326315 Share on other sites More sharing options...
Tech boy Posted March 13, 2012 Author Share Posted March 13, 2012 Hi here is the code index html first and then GetLineValue.php, is this format ok or should it be posted differently? thanks <html> <link rel="stylesheet" type="text/css" href="main.css" /> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <title>BBC Live Streams</title> <script type="text/javascript" src="http://www.bbc.co.uk/emp/swfobject.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/embed.js"></script> <!-- please do not include any scripts below this line in public bbc.co.uk pages. --> <link type="text/css" rel="stylesheet" href="SyntaxHighlighter.css" /> <link href="style.css" rel="stylesheet" type="text/css" media="all" /> <script type="text/javascript" src="http://www.bbc.co.uk/cs/jst/mod/1/jst_core.v1.2.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/simulcast/shCore.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/simulcast/shBrushJScript.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/simulcast/prototype.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/simulcast/scriptaculous.js?load=effects"></script> <!--this is the AJAX Script --> <script type="text/javascript"> function loadXMLDoc() { var xmlhttp; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 ) { document.getElementById("PHPVal").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","GetLineValue.php?q="+document.getElementById('PHPVal').value,true); xmlhttp.send(); } </script> </head> <div id="container"> <div id="leftPanel"> <div id="emp1" class="player" style="float:left"> <p>In order to see this content you need to have both <a href="http://www.bbc.co.uk/webwise/askbruce/articles/browse/java_1.shtml" title="BBC Webwise article about enabling javascript">Javascript</a> enabled and <a href="http://www.bbc.co.uk/webwise/askbruce/articles/download/howdoidownloadflashplayer_1.shtml" title="BBC Webwise article about downloading">Flash</a> installed. Visit <a href="http://www.bbc.co.uk/webwise/">BBC Webwise</a> for full instructions</p> </div> <script type="text/javascript"> dp.SyntaxHighlighter.HighlightAll('onceCode'); var width= 793; var height= 650; //var width= 640; //var height= 395; var playlist; var config; var revision; function reload(url) { var emp = new embeddedMedia.Player(); emp.setWidth(width); emp.setHeight(height); emp.setDomId("emp1"); emp.set("config_settings_autoPlay","true"); playlist = "http://www.bbc.co.uk/emp/simulcast/"+url+".xml"; emp.setPlaylist(playlist); config = "http://www.bbc.co.uk/emp/simulcast/config_"+url+".xml"; emp.setConfig(config); emp.write(); updateEmbed(); } function updateEmbed() { $('codeWrap').update('<pre name="code" class="js:nogutter" id="embedCode"></pre>'); $('embedCode').update("var emp = new embeddedMedia.Player();"+"\n"+ "emp.setWidth('"+width+"');"+"\n"+ "emp.setHeight('"+height+"');"+"\n"+ "emp.setPlaylist('"+playlist+"');"+"\n"+ "emp.setConfig('"+config+"');"+"\n"+ "emp.write();"); dp.SyntaxHighlighter.HighlightAll('code'); } reload("bbc_news24"); </script> </div> <div id="rightPanel"> <div id="PHPVal"></div> <b></b> <button type="button" onclick="loadXMLDoc()">Change Content</button> </div> </div> <div id="tickerTape"></div> </html> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title></title> </head> <body> <?php // Show all information, defaults to INFO_ALL //phpinfo(); //Connect to mysql and connect to the database test $q=$_GET["q"]; $q = $q + 1; echo $q; //function RetrieveCount($RealLine) //{ //$con = mysql_connect("localhost","root",""); //if (!$con) //{ //die('could not connect:'. mysql_error()); //} //mysql_select_db("test",$con); //$_line = $RealLine; //$result = mysql_query("SELECT count(`SCAN_ASSEMBLED`) as outstanding FROM `table 1` WHERE (`REAL_LINE` = '$_line' ) and (scan_assembled = 1) and (SCAN_ASSEMBLED_DATE = curdate())"); //while ($row = mysql_fetch_array($result)) //{ //unedit above and allow $row to equal database value //$row = 99; //return ($row); //close the database connection // mysql_close($con); //} ?> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/#findComment-1327007 Share on other sites More sharing options...
smerny Posted March 13, 2012 Share Posted March 13, 2012 is this format ok or should it be posted differently? should put tags around your code Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/#findComment-1327009 Share on other sites More sharing options...
trq Posted March 13, 2012 Share Posted March 13, 2012 Or better still, tags. Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/#findComment-1327020 Share on other sites More sharing options...
Tech boy Posted March 14, 2012 Author Share Posted March 14, 2012 Sorry I'll try again with the tags <html> <link rel="stylesheet" type="text/css" href="main.css" /> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <title>BBC Live Streams</title> <script type="text/javascript" src="http://www.bbc.co.uk/emp/swfobject.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/embed.js"></script> <!-- please do not include any scripts below this line in public bbc.co.uk pages. --> <link type="text/css" rel="stylesheet" href="SyntaxHighlighter.css" /> <link href="style.css" rel="stylesheet" type="text/css" media="all" /> <script type="text/javascript" src="http://www.bbc.co.uk/cs/jst/mod/1/jst_core.v1.2.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/simulcast/shCore.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/simulcast/shBrushJScript.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/simulcast/prototype.js"></script> <script type="text/javascript" src="http://www.bbc.co.uk/emp/simulcast/scriptaculous.js?load=effects"></script> <!--this is the AJAX Script --> <script type="text/javascript"> function loadXMLDoc() { var xmlhttp; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 ) { document.getElementById("PHPVal").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","GetLineValue.php?q="+document.getElementById('PHPVal').value,true); xmlhttp.send(); } </script> </head> <div id="container"> <div id="leftPanel"> <div id="emp1" class="player" style="float:left"> <p>In order to see this content you need to have both <a href="http://www.bbc.co.uk/webwise/askbruce/articles/browse/java_1.shtml" title="BBC Webwise article about enabling javascript">Javascript</a> enabled and <a href="http://www.bbc.co.uk/webwise/askbruce/articles/download/howdoidownloadflashplayer_1.shtml" title="BBC Webwise article about downloading">Flash</a> installed. Visit <a href="http://www.bbc.co.uk/webwise/">BBC Webwise</a> for full instructions</p> </div> <script type="text/javascript"> dp.SyntaxHighlighter.HighlightAll('onceCode'); var width= 793; var height= 650; //var width= 640; //var height= 395; var playlist; var config; var revision; function reload(url) { var emp = new embeddedMedia.Player(); emp.setWidth(width); emp.setHeight(height); emp.setDomId("emp1"); emp.set("config_settings_autoPlay","true"); playlist = "http://www.bbc.co.uk/emp/simulcast/"+url+".xml"; emp.setPlaylist(playlist); config = "http://www.bbc.co.uk/emp/simulcast/config_"+url+".xml"; emp.setConfig(config); emp.write(); updateEmbed(); } function updateEmbed() { $('codeWrap').update('<pre name="code" class="js:nogutter" id="embedCode"></pre>'); $('embedCode').update("var emp = new embeddedMedia.Player();"+"\n"+ "emp.setWidth('"+width+"');"+"\n"+ "emp.setHeight('"+height+"');"+"\n"+ "emp.setPlaylist('"+playlist+"');"+"\n"+ "emp.setConfig('"+config+"');"+"\n"+ "emp.write();"); dp.SyntaxHighlighter.HighlightAll('code'); } reload("bbc_news24"); </script> </div> <div id="rightPanel"> <div id="PHPVal"></div> <b></b> <button type="button" onclick="loadXMLDoc()">Change Content</button> </div> </div> <div id="tickerTape"></div> </html> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title></title> </head> <body> <?php // Show all information, defaults to INFO_ALL //phpinfo(); //Connect to mysql and connect to the database test $q=$_GET["q"]; $q = $q + 1; echo $q; //function RetrieveCount($RealLine) //{ //$con = mysql_connect("localhost","root",""); //if (!$con) //{ //die('could not connect:'. mysql_error()); //} //mysql_select_db("test",$con); //$_line = $RealLine; //$result = mysql_query("SELECT count(`SCAN_ASSEMBLED`) as outstanding FROM `table 1` WHERE (`REAL_LINE` = '$_line' ) and (scan_assembled = 1) and (SCAN_ASSEMBLED_DATE = curdate())"); //while ($row = mysql_fetch_array($result)) //{ //unedit above and allow $row to equal database value //$row = 99; //return ($row); //close the database connection // mysql_close($con); //} ?> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/#findComment-1327324 Share on other sites More sharing options...
sunfighter Posted March 14, 2012 Share Posted March 14, 2012 Use this line xmlhttp.open("GET","test.php?q="+document.getElementById('PHPVal').innerHTML, true); And I hope the HTML markup on your php file is a mistake. Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/#findComment-1327388 Share on other sites More sharing options...
Tech boy Posted March 14, 2012 Author Share Posted March 14, 2012 Hi just tried the different line of code, I encountered the same problem as before, only works on the first button click. The mark up is just left over from a previous road I was trying. Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/#findComment-1327460 Share on other sites More sharing options...
Tech boy Posted March 14, 2012 Author Share Posted March 14, 2012 Hi Sunfigther removed the mark up and included your change and it all works, thanks for the help!! Tech boy Quote Link to comment https://forums.phpfreaks.com/topic/258720-newbie-ajax-question-regarding-the-on-click-event/#findComment-1327462 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.