How to POST jQuery variables to PHP in same page?

Question

Both my jQuery code and PHP code are in the same PHP file (not two separate files).

I want to POST jQuery Variable to the PHP code.

But it Shows some errors ("undefined index") when running the PHP file.

PHP file is as follows (test.php).

<?php 
    $country = $_POST['userCountry'];
    $ip = $_POST['userIp'];

    echo $country;
    echo $ip;
?>

<html>
<head><title></title>
    <script src = "jquery.min.js"></script>
    <script>
        $.getJSON("http://freegeoip.net/json/", function(data) {
            var country = data.country_name;
            var ip = data.ip;

            $.ajax({
                method:"POST",
                url:"test.php",
                data:{userCountry:country, userIp:ip}
            });
        });
    </script>
</head>
<body></body>
</html>

@icecub, First argument for getJSON is URL which is passed in above example.. — Rayon
– Rayon, Commented Jul 3, 2016 at 17:08

mujuonly · Accepted Answer · 2016-07-03 17:27:08Z

<?php 
if(!empty($_POST)){
    $country = $_POST['userCountry'];
    $ip = $_POST['userIp'];

    echo $country;
    echo $ip;
}
?>

<html>
<head><title></title>
    <script src = "jquery.min.js"></script>
    <script>
        $(document).ready(function(){
        $.getJSON("http://freegeoip.net/json/", function(data) {
            var country = data.country_name;
            var ip = data.ip;
            $.ajax({
                method:"POST",
                url:"test.php",
                data:{userCountry:country, userIp:ip},
                success:function(result){
                    $('body').html(result);
                }

            });
           });
        });
    </script>
</head>
<body></body>
</html>

Try this code. Just Tested OK

line-segment · Accepted Answer · 2016-07-03 17:31:58Z

0

That's because PHP compiles on the server while jQuery compiles on client. You kept both in the same file. So by the time ajax runs PHP has already been compiled thus giving you the message undefined . Make a separate file for PHP part or use the isset() and refresh the page using jQuery once the data has been submitted.

answered Jul 3, 2016 at 17:31

line-segment

3895 silver badges14 bronze badges

1 Comment

AnushkaM Over a year ago

Thank you for the quick response. Your advice will be helpful in later implementations.

Louys Patrice Bessette · Accepted Answer · 2016-07-03 17:32:30Z

0

I'm not sure this is the wanted result...
But it looks like it. So try this:

(EDITED)

<html>
<head><title></title>
    <script src = "https://code.jquery.com/jquery-1.12.0.min.js"></script>

</head>
<body>
<div id="result1"></div>
<br>
<div id="result2"></div>

<script>
$(document).ready(function(){
    var country;
    var ip;

    $.getJSON("http://freegeoip.net/json/", function(data) {
        country = data.country_name;
        ip = data.ip;
        console.log(country+" "+ip);

        $("#result1").append(country);
        $("#result2").html(ip);
    });
});
</script>

</body>
</html>

Notice that there is no PHP or $.ajax... Only $getJSON.

edited Jul 3, 2016 at 17:32

answered Jul 3, 2016 at 17:18

Louys Patrice Bessette

34k7 gold badges40 silver badges69 bronze badges

2 Comments

AnushkaM Over a year ago

Thank you for the quick response. But php has to be there for further implementations. However this will be useful later..

Louys Patrice Bessette Over a year ago

Ok... With this, you could "play" a little with the result, organise, format, etc... Then send it to a PHP page. BTW, thank for making me discover usefull this link (freegeoip). ;)

Collectives™ on Stack Overflow

How to POST jQuery variables to PHP in same page?

3 Answers 3

Comments

1 Comment

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

2 Comments

Linked

Related