ajax data passing to php not working

Question

Okay so, I've scoured stackoverflow for this answer and have come across several threads talking about how to do this, and well, they just haven't helped me yet.

This is all on one page, so that's probably the big problem. I really don't wanna send the post data to some other page and then redirect back to the one in order to get this to work, but I will if you guys cannot assist me in this endeavor.

Anyway, I have this page and I'm trying to pass data to the php via ajax, and I know that php is a server-side language, so the page would have to be reloaded once the data is passed.

php:

if (isset($_POST['location'])) {
        echo $_POST['location'];
        echo "hey";
}

jquery:

var whateva = "hello";
$.post('index.php', {'location': whateva}, function(){
    //alert(data);
    //window.location.reload(true);

});

alert(data); does get it to work and echo out given the isset (and also prints out all of the other html), but that is an alert which isn't practical, especially from a user standpoint. But that means that this ajax function is working. The problem here is that I want the same page to load, just with the $_POST['location'] variable set, so I had the bright idea of just reloading the page as the function in this case, which doesn't work. The isset never succeeds

Any help will be appreciated, besides telling me that combining php and javascript is a horrible idea as I already know that

Edit:

I was told to try making another page to post the data back which still didn't work, here's the code for that (with the main page ajax adjusted to direct it there instead):

window.onload = function(){
var inter = <?php echo json_encode($_POST['location']); ?>;
$.post('index.php', {location: inter});
}

I have tried it with and without quotes around location in the .post. Also I have tried to just have the plain javascript there, without the onload, still nothing. The response on the main page when changed to this

$.post('intermediary.php', {location: whateva}, function(response) {
    // Log the response to the console
    console.log("Response: "+response);
});

it prints out the html of the hidden page, with the variable filled in (var inter = "hello" instead of having the php there, as it should), so the passing to that page works

Take a look at [this question and answer](http://stackoverflow.com/questions/5004233/jquery-ajax-post-example-with-php?rq=1). You need two files for ajax. No reloading necessary. That is arguably the whole purpose of ajax - to pass data from client (JS) to server (PHP) and back without any reloading at all. — larsAnders, Apr 16 '16 at 23:03
Two files. One file is visible to the user, and could be called a page, but the other file lives behind the scenes and is never loaded into the browser. AJAX talks to it. It responds, and the response is loaded into the visible file. — larsAnders, Apr 16 '16 at 23:10
So you're saying that I have to post data via ajax to a page behind the scenes to post it back to the page that I'm currently on?? — soulkingbrook, Apr 16 '16 at 23:14
Seems crazy, right? But it allows all kinds of marvelous things to happen behind the scenes on the server without ever reloading the page or slowing down the user experience. Users like this. — larsAnders, Apr 16 '16 at 23:20
@IarsAnders Still doesn't work. The console.log(response) like in the example you linked prints out the second page's html with the proper variable passed (the hello as in the main post), but it does not set off the isset still (or send the data back, no idea) — soulkingbrook, Apr 17 '16 at 00:51

larsAnders · Accepted Answer · 2016-04-17T02:16:17.370

1

Ok, here's the breakdown.

File one: index.html This file is HTML and Javascript only, and is the page seen by the user. This could be a php page, but it does not need to be. Notice the quotes around the string 'whateva'.

<html><head></head><body>

<script>
  $.post('intermediary.php', {location: 'whateva'}, function(response) {
      // Log the response to the console
      console.log("Response: "+response);
  });
</script>

</body></html>

File two: intermediary.php This file is PHP only. It receives data silently through POST and returns data by echoing it.

<?php
if (isset($_POST['location'])) {
    echo $_POST['location'];
    echo "hey";
} else {
    echo 'No data received!';
}
?>

edited Apr 17 '16 at 02:16

answered Apr 17 '16 at 01:30

larsAnders

3,813
1
15
19

okay, so what you're getting at now is that I send the data to be dealt with to the php file, and in that file do the database stuff, and then I should refresh the index page with the updated information? The console.log(response) prints out the variable on the index page now, but not in the php isset of the index page. Also it works with/without the quotes still, just fyi – soulkingbrook Apr 17 '16 at 02:23
Your answer did not mention anything about a database, but yes the php file should handle that. And the response coming back can be pushed into index.html with javascript via something like `$("#div_for_responses").html(response);`. No need to refresh that page. I would appreciate if you could upvote and accept my answer. – larsAnders Apr 17 '16 at 02:36
Thanks, and no problem. Just wanted to make sure I could understand everything first. Sorry about not mentioning the DB though, just figured with what I wanted (getting the php to have the data) to do it would have made sense. – soulkingbrook Apr 17 '16 at 02:41

Sidath · Answer 2 · 2016-04-17T01:40:32.153

Oh.... It's a simple mistake. your ajax syntax is wrong... Remove the quotes of ajax parameter inside the curly brackets. Just like

var whateva = "hello";
 $.post('index.php', {location: whateva}, function(){
 //alert(data);
 //window.location.reload(true);

 });

It will working fine.... But you might use variable to ajax paramete then, you should use variable name for ajax location parameter value. But you might use string for location parameter value, then you should use it value inside the quotes like this, $.post('yourfile.php',{location:'your_name'},function(){});. But you might use some value of location parameter use should type this code.$.post('yourfile.php',{location:30},function(){});

it "worked" with the quotes there and without. like on the alert(), it filled in the _POST variables. Also it worked on passing the data to the hidden page that I had made in the comments of the OP. The data just doesn't get sent to the index.php (the page all of this is on/user is viewing) page itself — soulkingbrook, Apr 17 '16 at 01:53

ajax data passing to php not working

2 Answers2