why php results in HTML are undefined when using JavaScript

Question

I need to get the IP of the client. I am able to get it through PHP variable "$_SERVER['REMOTE_ADDR']". I get this ip from server side php to html page through AJAX request but when I want to use this IP value in JavaScript it is showing that the value is undefined. any solution?

PHP code:

<?php echo $_SERVER['REMOTE_ADDR'];?>

HTML CODE:

<body onload='ip(); ip2();'>
<kbd id='ip' ></kbd>

JavaScript code:

function ip() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function () {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("ip").innerHTML =
        this.responseText;
    }
  };
  xhttp.open("POST", "ip.php");
  xhttp.send();
}

function ip2() {
  setTimeout(function () {
    var ip = document.getElementById("ip").value;
    alert(ip);
  }, 1000);
}

Try console.log(this.responseText) and tell us what you see. — mazedlx
– mazedlx, Commented Apr 11, 2017 at 8:40
Does the this.responseText contain the correct IP inside the ajax callback or does that also fail? — Shilly
– Shilly, Commented Apr 11, 2017 at 8:40
Im getting the correct ip on the html page but when im using javascript to get this ip value it is showing undefined — Shaikh Amaan FM
– Shaikh Amaan FM, Commented Apr 11, 2017 at 8:42
heaps of sugestions on how to do it here stackoverflow.com/questions/391979/… — Jason Joslin
– Jason Joslin, Commented Apr 11, 2017 at 8:44
well when I did what mazedlx said me to do. the ip I was getting in the html page is also now showing as undefined. — Shaikh Amaan FM
– Shaikh Amaan FM, Commented Apr 11, 2017 at 8:46

Yosvel Quintero · Accepted Answer · 2017-04-11 09:07:08Z

1

First of all you should validate that you are getting the right response from your AJAX request by check that the result is certainly written to the element with id attribute "ip", and than instead of using:

var ip = document.getElementById('ip').value;

You should use Node.textContent to get the text content:

var ip = document.getElementById('ip').textContent;

Code example (without AJAX request):

function ip() {
  document.getElementById('ip').innerHTML = '127.0.0.1';
}

function ip2() {
  setTimeout(function () {
    var ip = document.getElementById('ip').textContent;
    console.log(ip);
  }, 1000);
}

<body onload="ip(); ip2();">
<kbd id="ip" ></kbd>

edited Apr 11, 2017 at 9:07

answered Apr 11, 2017 at 8:47

Yosvel Quintero

19.1k5 gold badges39 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Amitesh Kumar · Accepted Answer · 2017-04-11 08:43:37Z

0

You want your Ip Address in java script , so have to put ip address in that tag i think.

<?php $ip_address =  $_SERVER['REMOTE_ADDR'];?>

<body onload='ip(); ip2();'>
<kbd id='ip' ><?php echo $ip_address; ?></kbd>

answered Apr 11, 2017 at 8:43

Amitesh Kumar

3,0891 gold badge28 silver badges42 bronze badges

1 Comment

Shaikh Amaan FM Over a year ago

well the problem is that I want the php script to be placed differently and not in the html file

Rizwan · Accepted Answer · 2017-04-11 09:07:30Z

0

<?php echo $_SERVER['REMOTE_ADDR'];?>
<html>
<head>
</head>
<body onload='ip();'>
<div id='ip' ></div>
</body>
</html>
<script>
function ip() {

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
    document.getElementById("ip").innerHTML =
    this.responseText;
    ip2(this.responseText);
}
};
xhttp.open("POST", "try.php");
xhttp.send();


}

function ip2(stringvalue) {
setTimeout(
       function() {
        var ip = document.getElementById("ip").value;
alert(stringvalue);
       },2000);
}
</script>

run this code you might found what is the problem.

answered Apr 11, 2017 at 9:07

Rizwan

1631 gold badge2 silver badges9 bronze badges

Collectives™ on Stack Overflow

why php results in HTML are undefined when using JavaScript

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related