admin管理员组文章数量:1130349
Ultimately, my goal is to obtain the latitude and longitude of the current user and then be able to save it into the database.
Before that I need to make an ajax call from jquery and pass these information into the php.
Right now, I simply want to echo any data from jquery. This is a child theme. Here is my current example:
functions.php
function my_enqueue() {
wp_enqueue_script( 'ajax-script', get_stylesheet_directory_uri(). '/js/custom.js', array('jquery') );
wp_localize_script( 'ajax-script', 'my_ajax_object',
array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue' );
//then
function singletest() {
if (isset($_POST["latitude"]) && !empty($_POST["latitude"])) {
$lat = $_REQUEST["latitude"];
$lon = $_REQUEST["longitude"];
echo '<br>';
echo 'latitude: '. $lat;
echo '<br>';
echo 'longitude: '.$lon;
}
die();
}
add_action ('wp_ajax_singletest', 'singletest'); //logged users
add_action ('wp_ajax_nopriv_singletest', 'singletest'); //for all users
custom.js
function showPositionFirstTime(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
console.log(latitude + ' space ' + longitude);
jQuery.ajax({
url: my_ajax_object.ajax_url,
type: "POST",
data: {
action: 'singletest',
latitude: latitude,
longitude: longitude
},
success: function(response) {
var responseTxt = 'Response for the page ' + response;
console.log('Got this from the server: ' + response);
$('.testing-block').append(responseTxt);
},
error: function(errorThrown){
console.log(errorThrown);
}
});
}
function getLocationFirstTime() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPositionFirstTime);
} else {
$('.cords').text("Geolocation is not supported by this browser.");
}
}
getLocationFirstTime();
display-location.php
echo '<div class="testing-block"></div>';
I am now able to display the content of the console log into the page. I think now I am going to be able to pass the coordinates, establish database connection and insert them.
Thank you everyone for your effort.
Ultimately, my goal is to obtain the latitude and longitude of the current user and then be able to save it into the database.
Before that I need to make an ajax call from jquery and pass these information into the php.
Right now, I simply want to echo any data from jquery. This is a child theme. Here is my current example:
functions.php
function my_enqueue() {
wp_enqueue_script( 'ajax-script', get_stylesheet_directory_uri(). '/js/custom.js', array('jquery') );
wp_localize_script( 'ajax-script', 'my_ajax_object',
array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue' );
//then
function singletest() {
if (isset($_POST["latitude"]) && !empty($_POST["latitude"])) {
$lat = $_REQUEST["latitude"];
$lon = $_REQUEST["longitude"];
echo '<br>';
echo 'latitude: '. $lat;
echo '<br>';
echo 'longitude: '.$lon;
}
die();
}
add_action ('wp_ajax_singletest', 'singletest'); //logged users
add_action ('wp_ajax_nopriv_singletest', 'singletest'); //for all users
custom.js
function showPositionFirstTime(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
console.log(latitude + ' space ' + longitude);
jQuery.ajax({
url: my_ajax_object.ajax_url,
type: "POST",
data: {
action: 'singletest',
latitude: latitude,
longitude: longitude
},
success: function(response) {
var responseTxt = 'Response for the page ' + response;
console.log('Got this from the server: ' + response);
$('.testing-block').append(responseTxt);
},
error: function(errorThrown){
console.log(errorThrown);
}
});
}
function getLocationFirstTime() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPositionFirstTime);
} else {
$('.cords').text("Geolocation is not supported by this browser.");
}
}
getLocationFirstTime();
display-location.php
echo '<div class="testing-block"></div>';
I am now able to display the content of the console log into the page. I think now I am going to be able to pass the coordinates, establish database connection and insert them.
Thank you everyone for your effort.
Share Improve this question edited Oct 30, 2018 at 3:12 asked Oct 29, 2018 at 21:16 user153210user153210 10 | Show 5 more comments1 Answer
Reset to default 1The solution to my problem is to:
- Add actions and create a function in
functions.php. - Create an empty block in
display-location.php. - Append the response from
jQuery.ajaxinsuccessfunction to previously created empty block.
I hope this will help someone in the future (final code is inside the edited question itself).
Thank you.
Ultimately, my goal is to obtain the latitude and longitude of the current user and then be able to save it into the database.
Before that I need to make an ajax call from jquery and pass these information into the php.
Right now, I simply want to echo any data from jquery. This is a child theme. Here is my current example:
functions.php
function my_enqueue() {
wp_enqueue_script( 'ajax-script', get_stylesheet_directory_uri(). '/js/custom.js', array('jquery') );
wp_localize_script( 'ajax-script', 'my_ajax_object',
array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue' );
//then
function singletest() {
if (isset($_POST["latitude"]) && !empty($_POST["latitude"])) {
$lat = $_REQUEST["latitude"];
$lon = $_REQUEST["longitude"];
echo '<br>';
echo 'latitude: '. $lat;
echo '<br>';
echo 'longitude: '.$lon;
}
die();
}
add_action ('wp_ajax_singletest', 'singletest'); //logged users
add_action ('wp_ajax_nopriv_singletest', 'singletest'); //for all users
custom.js
function showPositionFirstTime(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
console.log(latitude + ' space ' + longitude);
jQuery.ajax({
url: my_ajax_object.ajax_url,
type: "POST",
data: {
action: 'singletest',
latitude: latitude,
longitude: longitude
},
success: function(response) {
var responseTxt = 'Response for the page ' + response;
console.log('Got this from the server: ' + response);
$('.testing-block').append(responseTxt);
},
error: function(errorThrown){
console.log(errorThrown);
}
});
}
function getLocationFirstTime() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPositionFirstTime);
} else {
$('.cords').text("Geolocation is not supported by this browser.");
}
}
getLocationFirstTime();
display-location.php
echo '<div class="testing-block"></div>';
I am now able to display the content of the console log into the page. I think now I am going to be able to pass the coordinates, establish database connection and insert them.
Thank you everyone for your effort.
Ultimately, my goal is to obtain the latitude and longitude of the current user and then be able to save it into the database.
Before that I need to make an ajax call from jquery and pass these information into the php.
Right now, I simply want to echo any data from jquery. This is a child theme. Here is my current example:
functions.php
function my_enqueue() {
wp_enqueue_script( 'ajax-script', get_stylesheet_directory_uri(). '/js/custom.js', array('jquery') );
wp_localize_script( 'ajax-script', 'my_ajax_object',
array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue' );
//then
function singletest() {
if (isset($_POST["latitude"]) && !empty($_POST["latitude"])) {
$lat = $_REQUEST["latitude"];
$lon = $_REQUEST["longitude"];
echo '<br>';
echo 'latitude: '. $lat;
echo '<br>';
echo 'longitude: '.$lon;
}
die();
}
add_action ('wp_ajax_singletest', 'singletest'); //logged users
add_action ('wp_ajax_nopriv_singletest', 'singletest'); //for all users
custom.js
function showPositionFirstTime(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
console.log(latitude + ' space ' + longitude);
jQuery.ajax({
url: my_ajax_object.ajax_url,
type: "POST",
data: {
action: 'singletest',
latitude: latitude,
longitude: longitude
},
success: function(response) {
var responseTxt = 'Response for the page ' + response;
console.log('Got this from the server: ' + response);
$('.testing-block').append(responseTxt);
},
error: function(errorThrown){
console.log(errorThrown);
}
});
}
function getLocationFirstTime() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPositionFirstTime);
} else {
$('.cords').text("Geolocation is not supported by this browser.");
}
}
getLocationFirstTime();
display-location.php
echo '<div class="testing-block"></div>';
I am now able to display the content of the console log into the page. I think now I am going to be able to pass the coordinates, establish database connection and insert them.
Thank you everyone for your effort.
Share Improve this question edited Oct 30, 2018 at 3:12 asked Oct 29, 2018 at 21:16 user153210user153210 10- Since you are writing to the console, what does the console say? And what does the request response say in Developer Tools, Network? – Rick Hellewell Commented Oct 29, 2018 at 21:38
- Added screenshots from the console. – user153210 Commented Oct 29, 2018 at 22:17
- Well, a 400 is a 'bad request', which means that the request probably has a syntax error of some sort. But I don't know enough about Ajax/JS to help any further. There are online Ajax/JS syntax checkers; perhaps that will help. – Rick Hellewell Commented Oct 29, 2018 at 22:47
- Ajax/JS syntax seems to be correct. My major concern is the WordPress way of handling the request. Or maybe I got the whole idea of passing the variables from js wrong. Thanks for your time anyway. – user153210 Commented Oct 29, 2018 at 23:20
-
1
Unless you've misunderstood how requests to PHP work. Every request is a clean slate, you can't
POSTdata to the server on one request, then use that data via$_POSTon a new request. Nothing persists betweens requests unless you put it in the database. This isn't like a Node or a Python app that runs 24/7, when a PHP request ends, it exits, each request spins up a new instance from scratch – Tom J Nowell ♦ Commented Oct 30, 2018 at 0:18
1 Answer
Reset to default 1The solution to my problem is to:
- Add actions and create a function in
functions.php. - Create an empty block in
display-location.php. - Append the response from
jQuery.ajaxinsuccessfunction to previously created empty block.
I hope this will help someone in the future (final code is inside the edited question itself).
Thank you.
本文标签： jqueryAjax call in WordPressunable to display the data on the page
版权声明：本文标题：jquery - Ajax call in WordPress - unable to display the data on the page 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://it.en369.cn/questions/1749222238a2335131.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
POSTdata to the server on one request, then use that data via$_POSTon a new request. Nothing persists betweens requests unless you put it in the database. This isn't like a Node or a Python app that runs 24/7, when a PHP request ends, it exits, each request spins up a new instance from scratch – Tom J Nowell ♦ Commented Oct 30, 2018 at 0:18