On my main page I have a page called logs.php which I have set to update every 4 seconds using jquery/ajax. This will update the details of an .xml file which is stored locally.
file_put_contents("../../scripts/xml/logs.xml", $dom) or print_r(error_get_last());
Here is the jQuery:-
$(function(){
setInterval(function(){
$.ajax({
url:'scripts/php/log.controller.php',
success:function(data){
if(data == "scripts/php/status.controller.php"){
}else{
alert(data);
}
}
});
},4000);
});
When I alert(data); it shows me the changes of the updated XML file:
<?xml version="1.0"?>
<loglist resultcount="24"><log id="0"><messagedate>20/06/2014 10:34:48</messagedate><car></car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="1"><messagedate>20/06/2014 10:34:47</messagedate><car></car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="2"><messagedate>20/06/2014 10:34:35</messagedate><car>6</car><stat>Quit</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="3"><messagedate>20/06/2014 10:34:32</messagedate><car>8</car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="4"><messagedate>20/06/2014 10:34:31</messagedate><car>10</car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="5"><messagedate>20/06/2014 10:34:30</messagedate><car>3</car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="6"><messagedate>20/06/2014 10:34:28</messagedate><car>2</car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="7"><messagedate>20/06/2014 10:24:27</messagedate><car></car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="8"><messagedate>20/06/2014 10:15:16</messagedate><car>10</car><stat>Quit</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="9"><messagedate>20/06/2014 10:14:01</messagedate><car>4</car><stat>Quit</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="10"><messagedate>19/06/2014 14:07:35</messagedate><car></car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="11"><messagedate>19/06/2014 13:43:54</messagedate><car></car><stat>Ping</stat><ping></ping><job>Operator</job><operator></operator><jobref></jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="12"><messagedate>19/06/2014 13:42:58</messagedate><car>1</car><stat>Disp</stat><ping></ping><job>100 BLYTHE ROAD</job><operator></operator><jobref>220213</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="13"><messagedate>19/06/2014 13:42:57</messagedate><car>9</car><stat>Disp</stat><ping></ping><job>4 LILESTONE STREET; LONDON</job><operator></operator><jobref>220620</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="14"><messagedate>19/06/2014 13:42:56</messagedate><car>8</car><stat>Disp</stat><ping></ping><job>4 LILESTONE STREET; LONDON</job><operator></operator><jobref>220618</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="15"><messagedate>19/06/2014 13:42:56</messagedate><car>6</car><stat>Disp</stat><ping></ping><job>3P+3HL 22 MOUNT STREET</job><operator></operator><jobref>221165</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="16"><messagedate>19/06/2014 13:42:54</messagedate><car>5</car><stat>Disp</stat><ping></ping><job>GODOLPHIN LETYMER SCHOOL , IFFLEY ROAD</job><operator></operator><jobref>220211</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="17"><messagedate>19/06/2014 13:42:53</messagedate><car>4</car><stat>Disp</stat><ping></ping><job>32 ABERDEEN PLACE</job><operator></operator><jobref>220774</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="18"><messagedate>19/06/2014 13:42:52</messagedate><car>2</car><stat>Disp</stat><ping></ping><job>45 LOCKBRIDGE COURT WOODFIELD ROAD</job><operator></operator><jobref>221121</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="19"><messagedate>19/06/2014 13:42:50</messagedate><car>89</car><stat>Disp</stat><ping></ping><job>C------ GATWICK AIRPORT NORTH___EZY 8894__MARACUS</job><operator></operator><jobref>220793</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="20"><messagedate>19/06/2014 13:42:48</messagedate><car>43</car><stat>Disp</stat><ping></ping><job>183 EDGWARE ROAD; LONDON</job><operator></operator><jobref>221193</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="21"><messagedate>19/06/2014 13:42:45</messagedate><car>32</car><stat>Disp</stat><ping></ping><job>BEST WESTBURY SHAFTESBURY HOTEL, 27 DEVONSHIRE TERRACE</job><operator></operator><jobref>220989</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="22"><messagedate>19/06/2014 13:42:43</messagedate><car>111</car><stat>Disp</stat><ping></ping><job>22/17 ST. EDMUNDS TERRACE; LONDON</job><operator></operator><jobref>220973</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log><log id="23"><messagedate>19/06/2014 13:42:42</messagedate><car>10</car><stat>Disp</stat><ping></ping><job>WESTMINSTER ACADEMY;255 HARROW ROAD</job><operator></operator><jobref>220617</jobref><gpsx></gpsx><gpsy></gpsy><carspeed></carspeed></log></loglist>
But the page logs.php is not updating as it should be.
The logs.php file is populating a list as follows:-
<ul id="loglist" class="main-logs"></ul>
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
type: "GET",
url: 'scripts/xml/logs.xml',
datatype: "xml",
success: function(xml) {
var select = $('#loglist');
$(xml).find('log').each(function(){
var car = $(this).find('car').text();
var stat = $(this).find('stat').text();
var job = $(this).find('job').text();
select.append("<li>"+car+' - '+stat+' - '+job+"</li>");
});
}
});
});
</script>
Anyone have any idea why this is not updating?
I tried your example on fiddle and it seems to work perfectly if xml is a string. Try to change your dataType parameter to string instead of xml and it should work.
Here is my example: http://jsfiddle.net/8gEAN/
Try this:
<html>
<body>
<!--list to update-->
<ul id="loglist" class="main-logs"></ul>
<script type="text/javascript">
$(document).ready(function(){
$(function(){
//every 4 seconds send an ajax request to update the XML file
setInterval(function(){
$.ajax({
url:'scripts/php/log.controller.php',
success:function(data){
//when the XML is updated, send another ajax request to retrieve it and update the list
$.ajax({
type: "GET",
url: 'scripts/xml/logs.xml',
datatype: "string",
success: function(xml) {
var select = $('#loglist');
$(xml).find('log').each(function(){
var car = $(this).find('car').text();
var stat = $(this).find('stat').text();
var job = $(this).find('job').text();
select.append("<li>"+car+' - '+stat+' - '+job+"</li>");
});
}
});
}
});
},4000);
});
});
</script>
</body>
Put below function in your ajax call. This may be cache issue.
$.ajaxSetup ({
// Disable caching of AJAX responses
cache: false
});
For more details
Related
I am trying to send my values using ajax from original page to the page one and then to page 2 this is my code but it seems to be not working.
This is the code on the original page here I have only given the script as I am just using the click event of my div to send the values
<script>
function displayRecords(numRecords, pageNum,x,catg) {
$.ajax({
type: "GET",
url: "button.php",
data: {
show:numRecords,
pagenum:pageNum,
val12:x,
catg12:catg,
},
cache: false,
success: function(data) {
$("#tabs1-html").html(data);
}
});
}
function changeDisplayRowCount(numRecords) {
displayRecords(numRecords, 1);
}
$(document).ready(function() {
$('.tab12').click(function(){
var catg=$('#cat').val();
var x =$(this).val();
displayRecords(5,1,x,catg);
});
});
</script>
now for the code on my page 1
here
<script type="text/javascript">
function get_data(no,x,catg) {
$.ajax({
type:'post',
url:'question_call.php',
data:{
row_no:no,
X:x,
category:catg,
},
success:function(response) {
document.getElementById("pagination_div").innerHTML=response;
}
});
}
$(document).ready(function() {
$('#tota_page_div').click(function(){
var catg = $category.val();
var x = $X.val();
get_data(no,x,catg);
});
});
</script>
and these are the values where i saved the previous ones
$X = $_GET['val12'];
$category = $_GET['catg12'];
Now when I try to use print_r on my page 2 it only shows row_no not catg12 and val12
As i'm building an website that needs Ajax for sending POST methods without refreshing the entire page.
I tried using ajax to send data from an onclick event on an LINK-tag, but the ajax code does seem to send an EMPTY post.
This is the php/jquery/ajax code:
<p id="school_content">
</p>
<script src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".toggleThis").click(function(){
var Id = $(this).attr('id');
$.ajax({
contentType: "application/json; charset=utf-8",
url: "id_script.php",
type: "POST",
data: {
'school_name': Id,
},
success: function(data){
alert(Id);
},
});
$("#school_content").load("id_script.php");
});
});
</script>
The LINK-tag has the 'id' of the school of wich the information needs to be shown in the PARAGRAPH with 'id' "school_content" by this jquery part: $("#school_content").load("id_script.php"); .
The var Id = $(this).attr('id'); part works, because he's giving me the right school_name in an alert(); if I ask it to.
The id_script.php needs to get this POST in the usual way, but is does not..
The id_script.php code:
<?php
include('connect.php');
header('Content-Type: application/json');
if(isset($_POST['school_name'])){
$Id = $_POST['school_name'];
$extract = mysqli_query($con, "SELECT * FROM school_kaart WHERE school_name='$Id'");
$numro=mysqli_num_rows($extract);
if(mysqli_num_rows($extract) == '1'){
$row = mysqli_fetch_assoc($extract);
echo 'Yes it works!';
}
else{
echo 'Nope, didnt work!';
}
}
else{
echo 'Not posted!';
}
?>
I'm still getting "Not posted!" in the PARAGRAPH I mentioned earlier. What seems to be the problem?
.load is shorthand for an ajax request so you are actually doing 2 request.
The latter isn't sending any data and so it returns 'Not Posted!';
http://api.jquery.com/load/
try
<script src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".toggleThis").click(function(){
var Id = $(this).attr('id');
$.ajax({
url: "id_script.php",
type: "POST",
data: {
'school_name': Id,
},
success: function(data){
alert(Id);
$("#school_content").html(data);
},
});
//remove this
//$("#school_content").load("id_script.php");
});
});
</script>
I'm using jQuery autocomplete and want to retrieve data from php file called some.php, in which is only written
<?php
echo "Hello World";
?>
and here is javascript
<script type="text/javascript">
$(function(){
$("#key").autocomplete({
source: function(){
$.ajax({
type: "POST",
url: "./some.php",
data: {key: $("#key").val()},
success: function(result){
// what code is needed here to be placed
}
});
}
});
});
</script>
and html by the way =>
<input type="text" name="key" id="key">
I think script is written correctly , because when I'm writing in success function alert(result) it gets "Hello world", but I want it to be in drop down box , how can fix this problem , please help me , thanks :)
$("#key").autocomplete({
source: function(request, response){
$.ajax({
type: "POST",
url: "./some.php",
data: {key: request.term},
success: function(result){
response(result);
}
});
}
});
response(result) will display the autocomplete menu -- result should be an array of items (where each item is a string or an object with value or label keys).
As SJ GJ mentioned, you can simply set source: "./some.php" but then some.php needs to be modified to accept the request parameter term and return a json array of items.
try this:
JS:
<script type="text/javascript">
$(function(){
$("#key").autocomplete({
source: "./some.php"
});
});
</script>
PHP:
$result = array('1' => 'Hello World');
echo json_encode($result);
I have been researching for the last two days, and have found nothing.
structure:
index.php:
<head>
<script type="text/javascript" src="JS/jquery-1.6.2.js"></script>
<script type="text/javascript" src="function.js"></script>
</head>
<body>
<div>
<div>Show</div> *-->if I click this link data loads into DIV below by function.js without reloading*
<div id="producten"></div> *-->testpage.php loads here perfect,
the code of testpage.php makes by while loop other links.
Here I want to click on a link to load next data in div id=information
without reloading the index.php so the data in the first DIV stay visible
and I dont know how to do that*
<div id="information"></div> *-->testpage2.php have to load data from sql in this DIV*
</div>
</body>
function.js:
$(document).ready(function() {
$(".testcat").click(function() {
var testid = $(this).attr("id");
var datastring = 'id='+ testid ;
$.ajax({
type: "POST",
url: "testpage.php",
data: datastring,
cache: false,
success: function(res) {
$('#producten').html("<div class='loading'><img src='IMG/loading.gif' /></div>")
.hide()
.fadeIn(2000, function() {
$('#producten').html(res);
})
}
});
return false;
});
});
testpage.php and testpage2.php are PDO code for sql data.
You'll want to attach your click handlers with on so that dynamically added content still has the same ajax handlers available to them:
Add whatever information is needed to differentiate one click from the next, ie
<a href='...' data-resultdiv='production'
Then, cleaning up your handler a bit: I assume you want the ajax request to go to the href of the link, and that you want to show "loading" immediately (instead of waiting for the request to complete).
Finally, to cancel the anchor's default behavior of browsing to the page referenced by the href, you can return false;
$(document).on("click", "a", function() {
var href = $(this).attr("href");
var successDiv = $(this).data("resultdiv");
$('#' + successDiv).html("<div class='loading'><img src='IMG/loading.gif' /></div>");
$.ajax({
type: "POST",
url: href,
data: datastring,
cache: false,
success: function(res) {
$('#' + successDiv).hide().html(res).fadeIn(2000);
}
}
return false;
});
And of course if you only want this to run for certain anchors, you can put a selector on your call to on
$(document).on("click", "a.someClass", function() {
i have one jquery function which i need to work in following way
1. call a php file
2. log the values return by php file
3. have time delay
again repeat the above process for number of time
for this purpose i write bellow jquery and php file
<script type="text/javascript">
$(document).ready(function() {
listsValues="1,10,20";
n=0;
msgids = listsValues.split(',');
$.each(msgids, function() {
html="TEST MESSAGE";
n++;
setTimeout(function() {
$.ajax({
type: "POST",
url: "test1.php",
cache:false,
data:"id="+ msgids[n],
dataType:'json',
success: function(json)
{
var foo = json.foo;
uemail = foo.split(',');
console.log(uemail)
}
});
}, 1000);
});
});
</script>
and here is test1.php
<?php
$id=$_POST['id'];
$val="";
for($i=1;$i<=$id;$i++) {
$val.=$i;
}
$return["foo"] =$val;
print stripslashes(json_encode($return));
?>
but this is not working as a way i want, when i execute this script
i can see in firebug test1.php file executes (called) for 3times and after that values are written in console
as i said waht i want was
1. execute test1.php file
2. write value in console
3. give delay
then repeat
Thanks
I think you are searching something like this:
<script type="text/javascript">
function request(n) {
$.ajax({
type: "POST",
url: "test1.php",
cache:false,
data:"id="+ msgids[n],
dataType:'json',
success: function(json)
{
var foo = json.foo;
var uemail = foo.split(',');
console.log(uemail);
setTimeout(
function() {
request(n);
}
, 1000
);
}
});
}
$(document).ready(function() {
var listsValues="1,10,20";
var n=0;
var msgids = listsValues.split(',');
$.each(msgids, function() {
var html="TEST MESSAGE";
n++;
request(n);
});
});
</script>