By using this <?php echo date('r'); ?>, is there any way i can refresh simple container (span where my time is echo) without refreshing the page
Send AJAX request periodically to a PHP file which echos date.
(function worker() {
$.ajax({
url: 'backend.php',
success: function(data) {
$('.result').html(data);
},
complete: function() {
// Schedule the next request when the current one's complete
setTimeout(worker, 5000);
}
});
})();
Call this worker() function on the div of the date.
backend.php:
<?php
echo date('Y-m-d H:i:s'); // This is just a sample date format. YOUR DATE FORMAT.
?>
<iframe src="http://free.timeanddate.com/clock/i4gbn2wi/n1763/tt0/tw0/ts1/tb4" frameborder="0" width="132" height="34"></iframe>
Try this
Related
Hi I have a Php page with html and ajax request.
I am taking screenshot of that html data and saving thar screenshot on server using ajax, my problem is I need to send multiple screenshot of that page without reloading but html must be change as per records.
<?php
if(count($users) > 0)
{ ?>
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
HERE IS HTML MUST CHANGE AS PER USER, I CANT RELOAD
THE PAGE AGAIN AND AGAIN AS THIS IS A CRON JOB
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
<script type='text/javascript'>
function screenshot(){
html2canvas(document.getElementById('testing')).then(function(canvas)
{
//document.body.appendChild(canvas);
// Get base64URL
var base64URL = canvas.toDataURL('image/jpeg').replace('image/jpeg',
'image/octet-stream');
// AJAX request
$.ajax({
url: 'ajax/savePNG.php',
type: 'post',
data: {image: base64URL, user_id:"<?php echo $valuevb['user_id'];
?>"},
success: function(data){
console.log('Upload successfully');
}
});
});
}
</script>
I have a YouTube player on my page, the src comes from the session $_SESSION['video']['code'] which contains the YouTube video id.
I need it to change video when the PHP session is updated without reloading the page. Preferably with Jquery, but I'm open to others. My current code is below.
$(document).ready(function(){
refresTa();
});
function refresTa(){
$('.now_playing').load('../beta.php', function(){
setTimeout(refresTa, 1000);
});
}
The problem with it is it keeps refreshing the video, making it unplayable. is there a better way of doing this?
Instead of using .load() on .now_playing, fetch the data from PHP elsewhere, and call refresTa() only when needed. Something like this:
$(document).ready(function(){
myCheck();
});
function myCheck() {
$.ajax({
url: "ajax.php",
dataType: "json"
}).done(function(data) {
var myData = data.myData;
// do something based on data received
// call this function again
setTimeout(function(){
myCheck();
}, 10000); // every 10 seconds
});
}
In ajax.php, you can output the data back to Javascript with json_encode():
$returnArray = array("myData"=>$data);
exit(json_encode($returnArray));
I have these DIVS which run PHP functions and return results. How can i make the returned results automatically refresh every X seconds without refreshing the whole page.
I just want to re-run the PHP/MySQL queries that are in the functions
<div class="container">
<div class="box"><h2>Callers Waiting</h2><?php echo CallersWaiting($queue_name, date('Y-m-d H:i:s', strtotime('-1 hour'))); ?></div>
<div class="box"><h2>Average Hold Time</h2><?php echo AverageHoldTime($queue_name, $date); ?></div>
<div class="box"><h2>Longest Wait Time</h2><?php echo LongestWaitTime($queue_name, $date); ?></div>
<div class="box"><h2>Shortest Wait Time</h2><?php echo ShortestWaitTime($queue_name, $date); ?></div>
</div>
UPDATE:
I have used this code:
<div class="container"></div>
<script type="text/javascript">
$(document).ready(function(){
refreshTable();
});
function refreshTable(){
$('.container').load('data.php', function(){
setTimeout(refreshTable, 2000);
});
}
</script>
then all my divs and PHP Functions run on a page called data.php but nothing is showing on my index.php page
<meta http-equiv="refresh" content="5; URL=http://www.yourdomain.com/yoursite.html">
regresh page after 5 sec and if you need js i can send it too
setTimeout(function(){
window.location.reload(1);
}, 5000);
For ajax you need a page that return all you data in Json or xml form.
then you need to make $.POST or $.GET or $AJAX request to that page and then parse it and then update your html elements.
example
http://danielnouri.org/notes/2011/03/13/an-ajax-page-update-mini-tutorial/
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">// <![CDATA[
$(document).ready(function() {
$.ajaxSetup({ cache: false }); // This part addresses an IE bug. without it, IE will only load the first number and will never refresh
setInterval(function() {
$('.container').load('data.php');
}, 2000); // the "3000" here refers to the time to refresh the div. it is in milliseconds.
});
// ]]></script>
<div class="container">Loading data ...</div>
If you need to refresh a page when clicking on a div, you can use AJAX Poll, but if you want to update the element every specific period, your code must be like so
$(document).ready(function () {
setInterval(function () {
$.ajax({
url: 'data.php',
type: 'get',
dataType: 'json',
success: function (data) {
$("#your-element-id").html(data.your_data);
},
error: function (ERROR) {
console.log(ERROR);
}
});
}, 2000); // trigger this function every 2 sec.
});
I would like to display the server time in digital clock through jquery and PHP
I already tried like this. But it didn't work for me.
$(document).ready(function() {
function update() {
$.ajax({
type: 'POST',
url: 'time.php',
timeout: 1000,
success: function(data) {
$("#clock1").html(data);
window.setTimeout(update, 1000);
},
});
}
update();
});
time.php
echo time();
I tried like this, but this is client side only.
$(function(){
$("#clock1").MyDigitClock({
fontColor: "#83bffa" ,
fontSize:"30px"
});
});
at the same i want to display a calender(not date) also.
For date i used this code:
$(function(){
$.datepicker.setDefaults(
$.extend($.datepicker.regional[''])
);
$('#datepicker').datepicker();
$('#datepicker2').datepicker();
});
This is also client side. I want display time and date separate. Please help me.
The PHP function time() returns the current timestamp (something like: 1379333538).
If you want to display the current time formatted, you should use
<?php
echo date("H:i");
?>
in your PHP file.
Given your Javascript file, You need to remove the update function from the $(document).ready(function(){ }); block. Just like this:
$(document).ready(function() {
update();
});
function update() {
$.ajax({
type: 'POST',
url: 'time.php',
timeout: 1000,
success: function(data) {
$("#clock1").html(data);
window.setTimeout(update, 1000);
}
});
}
For the date, you can use pretty much the same method.
You can try using a json response for that.
For example:
server side:
$response = array('time' => date('H:i:s'), 'date' => date('Y-m-d'));
header('Content-type: application/json');
echo json_encode($response);
clien side:
$.getJSON('time.php', function(json) {
$("#clock1").html(json.time);
$("#datepicker").val(json.date);
});
The json variable in function(json) will have the properties of time and date as you defined in php.
I have this php script:
<?php
echo "Welcome!<br>";
sleep(3);
echo "Something else<br>";
sleep(3);
echo "Something else 2<br>";
?>
How can I do with jQuery to display results on real time or almost real time without waiting the whole script to finish, for example checking every seconds for new results until the script stop loading?
What if I have a php loop like this one:
<?php
while($x<10) {
echo "Hi<br>";
$x++;
}
?>
Can I do the same on this case?
This is my actual jQuery, but it wait until php script is complete:
<script>
$(document).ready(function() {
$('#submit').click(function() {
event.preventDefault();
$.ajax({
type: 'POST',
url: 'index.php',
data: { url : $('#url').val() },
success: function(data) {
$("#div").append(data);
}
});
});
});
</script>
You could make 3 different PHP scripts and write an AJAX call for each one
If I understand you right, you should check out this comment at the php docs:
http://php.net/manual/de/function.flush.php#76039
This will send content to the browser before finishing the script.