how to send data from javascript to a PHP script

Question

My code in js (doesn't work) to transfer data to PHP is:

function codeAddress() {
  var address = document.getElementById('address').value;
  geocoder.geocode({ 'address': address}, function(results, status) {
   if (status == google.maps.GeocoderStatus.OK) {
  map.setCenter(results[0].geometry.location);
  var marker = new google.maps.Marker({
      map: map,
      position: results[0].geometry.location

  }); 


  var input = results[0].geometry.location; 

 var lat = input.lat(); 
 console.log(lat); 

/*var lat =  input.lat();
var longitude = input.lng();
document.getElementById("wypisz").innerHTML=lat;
request.open("GET", "address.php?lat=" + lat, true);

        //var url = "address.php?lat=latitude&lng =longitude";  


//document.getElementById("wypisz").innerHTML = results[0].geometry.location.lng;

*/



$.ajax({
    type: "GET",
    data: "lat=" + lat,
    url:"address.php",
    success: function(data) { console.log(data) }
})

} else {
  alert('Geocode was not successful for the following reason: ' + status);
}
 });

And to get them in the PHP file :

if(isSet($_GET['lat'])){
    echo "param good";
} else {
    echo "incorrect";   
}

When I print_r it, it always displays empty Array. Can you help me make this conversion work?

Here's more of my code, this is the place where I mark specific latitude and longitude:

 <div id="panel">
  Address :
  <input id="address" name = "address" type="textbox" value="Warszawa, Pol">

  <input type="button" value="wstaw" onclick="codeAddress()" >

</div>
<div id="map-canvas"></div>

And here I send information to php file:

<input type="submit" id = "ff" value="Send information">

why not try json? is there a reason you want to use query string? — KiX Ortillan, Mar 03 '14 at 08:57
@mac actually you do not get anything in lat variable as mentioned by you. — Sadikhasan, Mar 03 '14 at 09:04
possible duplicate of [How to pass JavaScript variables to PHP?](http://stackoverflow.com/questions/1917576/how-to-pass-javascript-variables-to-php) — King-of-IT, Mar 03 '14 at 10:38

Sadikhasan · Answer 1 · 2014-03-03T09:25:16.900

0

Try using ajax call like :

$.ajax({
type:'GET'
url: "address.php?lat="+lat,
success:function(data){
}
});

edited Mar 03 '14 at 09:25

answered Mar 03 '14 at 09:10

Sadikhasan

18,365
21
80
122

I get message "incorrect", or empty array when I use print_r – mac Mar 03 '14 at 09:19
Ah, and also i get : Uncaught ReferenceError: $ is not defined – mac Mar 03 '14 at 09:21
are you import jQuery? – Sadikhasan Mar 03 '14 at 09:23
that's why you getting Uncaught ReferenceError: – Sadikhasan Mar 03 '14 at 09:26
That's true, when I added jQuery I didn't get error. But unfortunately it still displays "incorrect" or empty Array. – mac Mar 03 '14 at 09:32

almost smart · Accepted Answer · 2014-03-03T09:42:03.390

0

var req = new XMLHttpRequest(); 
req.open("GET", "adress.php", true);
req.onreadystatechange = function() {
    if(req.readyState != 4 || req.status != 200) 
        return; 
    console.log(req.responseText);
};
req.send("lat=" + lat);

This is an extremely simplistic method though and if you want all bells and whistles in regards to error validation etc, I strongly suggest you use jquery and $.get:

$.ajax({
        type: "GET",
        data: "lat=" + lat,
        url:"address.php",
        success: function(data) { console.log(data) }
    })

edited Mar 03 '14 at 09:42

answered Mar 03 '14 at 09:32

almost smart

115
6

I got: Uncaught TypeError: Object # has no method 'done' – mac Mar 03 '14 at 09:39
fixed my jquery answer – almost smart Mar 03 '14 at 09:42
Now, no error on page but still empty array in php. – mac Mar 03 '14 at 09:49
how are you checking your php script output? are you using chrome/firefox developer tools? – almost smart Mar 03 '14 at 09:52
In fact I only display print_r value, and also check Chrome console. – mac Mar 03 '14 at 09:56
open the chrome developer tools and check the "network" tab to see if your GET request goes through. check the status code and make sure the request url is correct in the header section (after you select your request in the list). if you need more info on the developer tools/network tab consult its help page: https://developers.google.com/chrome-developer-tools/docs/network?hl=de#network_resource_details – almost smart Mar 03 '14 at 10:02
hm, as U advised I look it up, but there aren't any mistakes – mac Mar 03 '14 at 10:20
and you're checking the response tab of the request? – almost smart Mar 03 '14 at 10:48
mm, now when I was chcecking Chrome tools I clicked on this lat request, and it took me to page :address.php?lat=52.1553949, where all this convertion works, but when I send information from form by clicking submit button I go to page: address.php, where I still got empty array – mac Mar 03 '14 at 10:57
judging by the code you've posted, you're already sending information to your php script when you click on the "wstaw" button (since it's calling your javascript function which makes the asynchronous call). your request payload has a parameter you need to process thru javascript ("lat"), so having another submit button in this specific context doesn't make sense as you're not submitting any actual form data. a better solution would be removing the submit button and displaying a message in the success function of your ajax request that everything has been submitted. – almost smart Mar 03 '14 at 11:19
Yes, but I have also other data, which i load through form and this submit button. Do You have idea how to do it ? – mac Mar 03 '14 at 11:57
you can extend your data object in the $.ajax call to accommodate any other parameter e.g. data. "lat=" + lat + "&param1=" + param1 – almost smart Mar 03 '14 at 12:01
Ok, im not good in ajax, but i'll try.Thanks for help. I'wouldn't get so far with this issue without it. – mac Mar 03 '14 at 12:10

how to send data from javascript to a PHP script

2 Answers2