Ajax in Wordpress to reload a SELECT every second - php

Question

My target is to take a page of an existent WP theme and customize a full width page, to make that every 1 seconds a MySQL SELECT query is reloaded and the results are shown.
Starting with this snippets I have made the following editing/new files:
template-fullwidth.php
functions.php
my.js (new file)
GetPostDate.php (new file)
What I have done
I started from the template-fullwidth.php of a theme and add the following code between the DIV of the post. The place where I wanted to show the results is between <div id="MaxPostDate"> tags.
</div><!-- .post -->
<!-- START CUSTOM PAGE CODE -->
<?php
if ( is_user_logged_in() ) {
// --- START IF USER LOGGED IN --- //
// Get the current user name and id
?>
<div id="MaxPostDate"></div>
<?php
// --- END IF USER LOGGED IN --- //
} else {
// --- START IF USER NOT LOGGED IN --- //
echo "<p>You have to log-in to see this content</p>";
// --- END IF USER NOT LOGGED IN --- //
}
?>
<div class="result"></div>
<!-- END CUSTOM PAGE CODE -->
<?php comments_template( '', true ); ?>
</div><!-- .posts -->
then I have edited the functions.php file of the theme adding this in the end:
function add_myjavascript(){
wp_enqueue_script( 'ajax-implementation.js', get_bloginfo('template_directory') . "/js/my.js", array( 'jquery' ) );
}
add_action( 'init', 'add_myjavascript' );
function MyAjaxFunction(){
//get the data from ajax() call
$TableContent = $wpdb->get_results("
SELECT MAX(`post_date`) AS MaxDate FROM wp_posts"
);
foreach($TableContent as $Content){echo "<h1>" . $Content->MaxDate . "</h1>";}
// Return the String
die($results);
}
// creating Ajax call for WordPress
add_action( 'wp_ajax_nopriv_MyAjaxFunction', 'MyAjaxFunction' );
add_action( 'wp_ajax_MyAjaxFunction', 'MyAjaxFunction' );
?>
Then, I have made this my.js in the js folder of the theme:
jQuery(document).ready(function refresh_div() {
jQuery.ajax({
url:'/MySite/wp-content/themes/hemingway/GetPostDate.php',
type:'POST',
success:function(results) {
jQuery(".result").html(results);
}
});
}
t = setInterval(refresh_div,1000););
And finally make another file GetPostDate.php
<?php
$TableContent = $wpdb->get_results("
SELECT MAX(`post_date`) AS MaxDate FROM wp_posts"
);
foreach($TableContent as $Content){echo "<h1>" . $Content->MaxDate . "</h1>";
?>
The problems
nothing appear inside the DIV id="MaxPostDate"
I have wrote two time the same query (SELECT MAX(post_date) AS MaxDate FROM wp_posts), I would be wrote just one time!

Answer 1

I think the problem is with your AJAX URL.
Execute your AJAX in footer.php like below:
jQuery.ajax({
url:'<?php echo admin_url('admin-ajax.php'); ?>',
type:'POST',
success:function(results) {
jQuery(".result").html(results);
}
});
then you don't need GetPostDate.php file either.

Answer 2

this my.js in the js folder of the theme
jQuery(document).ready(function refresh_div() {
jQuery.ajax({
url:'//MySite/mysite/wp-admin/admin-ajax.php',
action:'MyAjaxFunction',
type:'POST',
dataType:json,
success:function(results) {
jQuery(".result").html(results.result);
}
});
}
t = setInterval(refresh_div,1000););
the functions.php file of the theme adding this in the end:
function MyAjaxFunction(){
//get the data from ajax() call
$jsonresult = array();
$TableContent = $wpdb->get_results("
SELECT MAX(`post_date`) AS MaxDate FROM wp_posts"
);
foreach($TableContent as $Content){
$jsonresult['result'] = $Content->MaxDate
}
echo json_encode($jsonresult);
die();
}
// creating Ajax call for WordPress
add_action( 'wp_ajax_nopriv_MyAjaxFunction', 'MyAjaxFunction' );
add_action( 'wp_ajax_MyAjaxFunction', 'MyAjaxFunction' );