How to refresh the WordPress home page without user noticing? - javascript

I would like to refresh the home page every X sec. I found this solution:
Install Auto Refresh Single Page plugin
Insert to header.php the lines:
if (is_front_page()) {
echo '<META HTTP-EQUIV="REFRESH" CONTENT="5">' ;
}
It refreshes the page but I notice that the page is reloaded. I would like it to happen smoothly. I don't want the refresh to make the page disappear for milliseconds. I want to refresh without the user noticing.
I have a page build with Wordpress. This page have few divs. Part of them list post type - and I need i to updated in case a new post submitted. Some divs need to change according to time of the day or the week and display different data. The page need to show all the time like a TV and information should be update automatically with no human touch. I tried to use ajax, but I don't know how to point it to reload specific div that built from Wordpress - I have no URL for specific div.

Check this out
if (is_front_page()) {
?>
<script>
setTimeout(function() { window.location = ""; }, 1000); //1 sec = 1000
</script>
<?php
}

I read your question, And as i thinking, you want update your posts on users homepage without any reloading. This can be done using "AJAX PHP". You should find plugins that uses "AJAX PHP" or "AJAX JAVASCRIPT".I hope this would be useful for you.

Related

Refresh Page with URL Hash after Submitting Form with jQuery Tabs

I'm a long time self taught user, just never had an issue that wasn't already answered in some form or another. Awesome community thank you all!
So I am dumbfounded as to why javascript will not properly refresh my page.
I have a very large page that I use with jquery and vertical tabs tagged with url hashes. This is a new function I recently added after updating to the newest version.
Upon clicking submit the form refreshes and if $_POST[update] is set it will run a set of queries. Then I have a javascript timeout that refreshes the page (ideally to the correct tab ex: home/database.php?file=101#tab3)
an excerpt of my messy code:
if(isset($_POST['update']))
{ do a bunch of sql stuff
....
<pre>
<?PHP
//unset update variable
$_POST = array();
//print_r(get_defined_vars());
?>
</pre>
</br>
<script type="text/javascript">
function Redirect() {
$('#redirect').trigger('click');
}
var currenturl = window.location.href;
document.write("<form action=" + currenturl +"><input type=submit name=redirect value=Redirect></form>");
document.write("</br>You will be redirected back to the file in 2 seconds.");
setTimeout('Redirect()', 2000);
</script>
<?php
mysql_close($conn);
}
else
{ display usual data....check boxes etc
Now I've tried refreshing in every conceivable way. I clear out the $_POST array so the page should reload displaying information, but it doesn't. However my confirmation of queries being ran show that 0 rows updated, so its not triggering the sql but also isn't properly refreshing still.
I found a function that stored the last clicked tab in the browsers session, however when you switch files, it would skip to that tab. Instead I would want to show the default tab.
I even tried made a button that on click it goes to the proper url which is shown above. It works when I click it manually but does not work when I trigger it via javascript. Even goes to the appropriate tab.
I am updating the url in the address bar using the below function. Also using the latest version of chrome.
<script>
$( "#tabs" ).tabs({
activate: function(event, ui) {
window.location.replace('#' + $(ui.newPanel).attr('id'));
var curTab = $(ui.newPanel).attr('id');
console.log(curTab);
}
});
</script>
Why don't you instead of sending that number after <form_url>?<params>#3 send that number as a request param in the url, for example like this <form_url>?tab=3?

Index page button trigger to display div on another page

I'm new to PHP, I want to have a button on my index page, when the button is clicked, it will trigger page 2 to display a DIV with my own content but I will remain in index page without redirect to page 2, and DIV on page 2 is hidden when the button is not clicked.
Is there any way I can achieve this?
If you really stand behind your bad idea, just go for:
if(isset($_POST['submit'])) {
echo "<div>My hidden content</div>"
}
This will be on secondary page ^
<form action="page2.php" method="post">
<button name="submit">Submit</button>
</form>
This will be on your index page ^
As guys mentioned before, it's better practice to use JavaScript to do that. Call a post request without refreshing the page. Or if you want open connection between client and server, use node.js (server-side JavaScript)
Well, if you want to stay on the first page after click on the button and you won't use any JavaScript, you can do it also this way. But it will get redirected 2 times, so it's kinda... Not efficient and client friendly.
Your second page:
if(isset($_POST['submit'])) {
setcookie("CLICKED",'ThisValueDoesntMatter',time()+31556926 ,'/');
header("HTTP/1.1 301 Moved Permanently");
header('Location: ' . $_SERVER['HTTP_REFERER']);
}
if(isset($_COOKIE['CLICKED'])) {
echo "<div>My hidden content</div>"
}
It is also insecure if the button is supposed to be on some page with authentication.
The index page stays the same.
NOTE: The cookie has lifetime of 1 year.

yii2: update/refresh/reload a page using Pjax different from requesting page

I have asked this question, but I think that wasn't clear enough so I am putting it differently. I have a _form.php page and a grid-view(index.php)page.
I am sending a Pjax request from _form.php and want to update/refresh the grid-view(index.php)page.
on top my _form.php I am having this code.
<?php
$this->registerJs(
'$("document").ready(function(){
$("#new_medicine").on("pjax:end", function() {
$.pjax.reload({container:"#medicine"}); //Reload GridView
});
});'
);
?>
Now the container "#medicine" is not on _form.php page, but grid-view(index.php) page. So how can I modify the above code so that it updates/refresh the container "#medicine" in index.php page.
I think I have explained the situation correctly. please tell me, if more information is needed.
Thanks.
Try using $this::POS_READY instead of wrapping your code in $("document").ready(function(){})
$js = '$("#new_medicine").on("pjax:end", function() {
$.pjax.reload({container:"#medicine"}); //Reload GridView
});'
$this->registerJs($js, $this::POS_READY);
EDIT
Apparently you want to reload the gridview that is open on another client's index.php after data is inserted using _form.php.
It isn't possible to send jQuery commands to another client (browser) and have it executed.
You can for example reload the gridview on the index.php every x seconds or minutes.
$js = 'function refresh() {
$.pjax.reload({container:"#medicine"});
setTimeout(refresh, 5000); // restart the function every 5 seconds
}
refresh();';
$this->registerJs($js, $this::POS_READY);

reload php page with javascript

I have drawn a chess board in a php page. Every piece is set as draggable, and every tile as droppable. Once a piece is dropped on a tile, I'd like to reload the php page so the board can be drawn anew along with new positions.
How can I do that: reloading the php page with javascript, without displaying a window asking for confirmation such as "To display this page, Firefox must send information that will repeat any action (such as a search or order confirmation) that was performed earlier. ->Cancel; Resend" ?
Or perhaps there are better solutions?
If you want to avoid having refresh reporting data (for any reason, including the user clicking the reload button) then use the POST-REDIRECT-GET pattern (http://en.wikipedia.org/wiki/Post/Redirect/Get). Read that, it will explain what to do.
Quick solution: you could try:
window.location.reload(true); //true sets request type to GET
Use GET, instead of POST and the dialog box you are getting will go away.
Good luck!
Make use of
window.location.reload();
will refresh automatically
<script>
var timer = null;
function auto_reload()
{
window.location = 'http://domain.com/page.php'; //your page location
}
</script>
<!-- Reload page every 10 seconds. -->
<body onload="timer = setTimeout('auto_reload()',10000);">
reference http://davidwalsh.name/automatically-refresh-page-javascript-meta-tags

Is there any way to redirect to a new page and write some content with jquery on that page?

I am making a function which searches the database for flight information. I want user to be redirected on "ticket.php" if the response is true. I want to update the content of the page "ticket.php" using jquery. But jquery doesn't work. Am I doing something wrong here ? Here's part of javascript. It's an external javascript. It's included in both "search.php" and "ticket.php" page. This function gets invoked by clicking on search button in "search.php" page.
if(data){
setTimeout("location.href = 'ticket.php';",3000); // Redirect to new page
//Change content of "ticket.php" using jquery.
$("#source").text(x);
$("#destination").text(y);
$("#date").text(z);
$("#no_person").text(person);
$("#trip_type").text(type);
}
else
$("#alert").text("Oops! No Flight matches your criteria ! ");
When you set location.href to ticket.php, the user is then redirected to that new page (ticket.php). Then the browser will load that new page and will no longer use the javascript you have on your current page.
You will have to make the data appear on ticket.php, using e.g. url parameters taken from what they searched like this:
window.location.href = 'ticket.php?from=norway&to=sweden';
The reason this is not working for you is because when you redirect to ticket.php the page is reloaded and all of the javascript on the page is refreshed, losing whatever value they had before. To keep the data you have to send the information to ticket.php
There are a couple of ways to accomplish this, ordered in preferred method.
all assuming you are requesting the page like this: ticket.php?from=norway&to=sweden
php on the page ticket.php
<?php
echo $_GET['from'];
echo $_GET['to'];
?>
javascript on the page ticket.php
solution for getting params from this post:https://stackoverflow.com/a/1404100/2033671
alert(getURLParameter('from'));
alert(getURLParameter('to'));
jQuery from a different page on the same domain
$.get('ticket.php',function(response){
$html = $(response);
$html.find("#destination").text(y);
$html.find("#source").text(x);
$("html").html($html);
});

Categories

Resources