DIV auto refresh - php

I try to refresh div every 5 sec but it doesn't work, I have 3 files.
index.php that contains:
<html>
<head>
<script type="text/javascript" src="javascript/jquery-1.3.2.js" ></script>
<script type="text/javascript" src="javascript/javascript.js" ></script>
<script type="text/javascript">
$(document).ready(function(){
setInterval ("newmsg()", 5000);
setInterval ("newpause()", 5000);
});
</script>
</head>
<body>
<div id="msgs">
<?php echo date("H:i:s"); ?>
</div>
</body>
</html>
Then I have javascript.js that contains
function GetXmlHttpObject() {
var xmlHttp = null;
try {
xmlHttp = new XMLHttpRequest();
}
catch (e) {
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
function newmsg(){
var request = GetXmlHttpObject();
request.open("get", "msgsprint.php", true);
request.send(null);
request.onreadystatechange = function response() {
if (request.readyState === 4) {
if(request.responseText != "false"){
$('#msgs').html(request.responseText);
}
}
}
}
function newpause(){
var request = GetXmlHttpObject();
request.open("get", "newpauseprint.php", true);
request.send(null);
request.onreadystatechange = function response() {
if (request.readyState === 4) {
if(request.responseText != "false"){
$('#newpauselist').html(request.responseText);
}
}
}
}
and i have msgsprint.php that contains
<?php
echo 'ivan';
?>
Could anybody please tell me what i did wrong.

There doesn't seem to be anything wrong in your code, maybe you are not getting a valid answer from msgsprint.php.
Here is a Demo based on your code that is working fine
I advise you to:
- you test the request status for an error.
- you use setTimeout to plan the next call to newmsgs
That's what i did in the demo.

Related

Yii2 ajax xmlhttp.open

How i can use this function in my Yii2 aplication?
<script type="text/javascript">
function ajaxrunning()
{
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp =new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","autoload.php");
xmlhttp.send();
setTimeout("ajaxrunning()", 5000);
}
</script>
And i want to change the autoload.php to be the controller function http://localhost/ta/backend/web/index.php?r=sms/auto
You need to create the function in the controller to you make the call .
The path will be like this controllerName/actionName
Read this example
//PHP UserController.php
function actionSomething(){
//do something
return 'aaaa';
}
//JS code
<script type="text/javascript">
function ajaxrunning() {
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == XMLHttpRequest.DONE) {
if (xmlhttp.status == 200) {
console.log(xmlhttp.responseText);// this write 'aaaa'.
}
else if (xmlhttp.status == 400) {
alert('There was an error 400');
}
else {
alert('something else other than 200 was returned');
}
}
}
xmlhttp.open("GET", "/user/something");
xmlhttp.send();
setTimeout("ajaxrunning()", 5000);
}
</script>
I recomend to use JQuery and not Javascript Vanilla, is more easy and clear.

PHP code does not run

I'm trying to run a PHP code by the click of a button, but it does not seem to work. I'm running this on a MAPM server.
<html>
<head>
</head>
<div onClick="count();">Click!</div>
<script>
function count() {
var xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open('GET', 'count.php');
xhr.send();
}​
</script>
</body>
</html>
In the PHP file (count.php) we have this code:
<?php
Print "Hello, World!";
?>
you need your page to listen to the request;
function count() {
var xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.onreadystatechange = function (){
if(xhr.readyState == 4){
if(xhr.status == 200){
// WHAT HAPPENS ON SUCCESS
alert(xhr.responseText);
}else{
alert('timeout error or something');
}
}
};
xhr.open('GET', 'count.php');
xhr.send();
}​;
You need to pass null to the send() method like below (also be sure that the URL is correct, my hunch is that it should be "/count.php"):
xhr.send(null) // it's a GET request
For a detailed tutorial, check out this MDN doc https://developer.mozilla.org/en/AJAX/Getting_Started

jQuery - Ajax XMLHttpRequest?

In jQuery you can easily just use their Ajax library. The problem is that I only need it ONE time in my code, so it would not be nessesary to call the whole JavaScript library.
I have this code I have been working on, but I can't seem to get it working. I am trying to start a PHP script by the click of a button. How do I do that?
Here is how far I am right now:
<div onClick="count();">Click!</div>
<script>
function count() {
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest()
} else {
if (window.ActiveXObject) {
var xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
xhr.open('GET', 'count.php', false);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status === 200) {
while (results.hasChildNodes()) {
results.removeChild(results.lastChild);
}
results.appendChild(document.createTextNode(xhr.responseText));
}
}
xhr.send();
}, false);
}
</script>
And here is the code inside the PHP file:
<?php
mysql_connect("myhost", "username", "password") or die(mysql_error());
mysql_select_db("mydatabase") or die(mysql_error());
mysql_query("INSERT INTO `table` (`field`) VALUES(\'+1\'); ")
or die(mysql_error());
?>
<script>
function count() {
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest()
} else {
if (window.ActiveXObject) {
var xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
xhr.open('GET', 'count.php', false);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status === 200) {
while (results.hasChildNodes()) {
results.removeChild(results.lastChild);
}
results.appendChild(document.createTextNode(xhr.responseText));
}
}
xhr.send();
}, false); // This Line looks extra. Remove this and try
}
</script>
Very short method.
HTML:
<input type="button" onclick="count()" value="count">
JS:
function count() {
url="yourphp.php";
objX=new XMLHttpRequest();
objX.open("GET",url,false);
objX.send(null);
}

Include js file in Ajax XMLHttpRequest

I'm using Ajax and code which is described below. I want to include .js file in Ajax XMLHttpRequest. Does anybody know how to do that?
For example:
I have code below:
function getXMLHttp()
{
var xmlHttp
try
{
//Firefox, Opera 8.0+, Safari
xmlHttp = new XMLHttpRequest();
}
catch(e)
{
//Internet Explorer
try
{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
alert("Your browser does not support AJAX!")
return false;
}
}
}
return xmlHttp;
}
function MakeRequest(id)
{
var xmlHttp = getXMLHttp();
xmlHttp.onreadystatechange = function()
{
if(xmlHttp.readyState == 4)
{
HandleResponse(xmlHttp.responseText);
}
}
xmlHttp.open("GET", "updatesite.admin.php?id="+id, true);
xmlHttp.send(null);
}
function HandleResponse(response)
{
document.getElementById('Vsebina').innerHTML = response;
}
When program call function MakeRequest(id) then i want to also executed some .js file.
Is it possible to do that?
You could always put this code in your function to cause a script to be loaded and executed...
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://location-of-script.js";
document.body.appendChild(script);
Here's a complete example. These two files just need to be in the same folder on the server.
This is hello.html:
<html>
<head>
<script type="text/javascript">
function doit()
{
var scr = document.createElement('script');
scr.type = "text/javascript";
scr.src = "hello.js";
document.body.appendChild(scr);
}
</script>
</head>
<body>
<input type="button" value="hello" onclick="doit();">
</body>
</html>
And this is hello.js:
alert("helloooo!!");

Refresh PHP Page using ajax

I have a php page that needs to be refreshed every 5 secs. On embedding the ajax file, I don't find the updates taking place in Firebug. Here is the skeleton of the code:
**notification.php**
<?php
....
....
?>
<html>
<head>
<script src="./refresh.js"></script>
<script type="text/javascript">
refreshContents();
</script>
</head>
<body>
....
<div id="identifier">
<p>Waiting area</p>
</div>
</body>
</html>
**refresh.js**
var seconds = 5;
var content = "identifier";
var url = "notification.php";
function refreshContents()
{
var xmlHttp;
try
{
xmlHttp = new XMLHttpRequest();
}
catch(e)
{
try
{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(f)
{
try
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(g)
{
alert("Browser not supports Ajax");
return false;
}
}
}
xmlHttp.onreadystatechange=function()
{
if (xmlHttp.readyState == 4)
{
document.getElementById(content).innerHTML = xmlHttp.responseText;
setTimeout('refreshContents()', seconds*1000);
}
}
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
var seconds = 5;
window.onload = function startrefresh(){
setTimeout('refreshContents()', seconds*1000);
}
Though it may not be the ideal solution, jQuery has a pretty simple way of implementing exactly this:
$(document).ready(function () {
function reload() {
$("#content").load("notification.php");
}
setTimeOut(reload, seconds*1000)
}
I'm not sure that will work perfectly, haven't done it in a little while, but its a much more elegant solution I do believe.
Why not just put a <meta http-equiv="refresh" content="5"> tag into your <head>? It will refresh the page every 5 seconds without the need for any javascript.
see the following example :
<html>
<head>
<title>Refresh a page in jQuery</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
</head>
<body>
<button id="PageRefresh">Refresh a Page in jQuery</button>
<script type="text/javascript">
$('#PageRefresh').click(function() {
location.reload();
});
</script>
</body>
</html>
this code definetly help you.
or we can use -
<meta http-equiv="refresh" content="5">

Categories