0

So, I am trying to do a simple data display. I've got my HTML with my p-tag where the processed data is supposed to be displayed, I've got my JS script with my 2 functions, one for updating the HTML and one for the AJAX request. The php-script which is called currently does nothing more than returning the same data it got with <?php $q = $_GET['q']; echo $q; ?>.

Heres the HTML:

<form  name="form1">
  <select onchange="showUser(this.value)" name="users" form="form1">
    <option value="">Select a person:</option>
    <option value="1">Peter Griffin</option>
    <option value="2">Lois Griffin</option>
    <option value="3">Joe Swanson</option>
    <option value="4">Glenn Quagmire</option>
  </select>
</form>
<br>

  <p id="txt"></p>


<script type="text/javascript" src="js/main.js"></script>

And here's the JS:

      var myData = "";

      function getData(parameter) {
        if (window.XMLHttpRequest) {
          var xhttp = new XMLHttpRequest();
        } else {
          xhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xhttp.onreadystatechange = function() {
          if (this.readyState == 4 && this.status == 200) {
            var myStatusTxt = this.statusText;
            myData = this.responseText;
          }
        };
        xhttp.open("GET", "http://192.168.0.154/testing/getuser.php?q=" + parameter , true);
        xhttp.send();

        return myData;
      }

    function showUser(str) {


      document.getElementById("txt").innerHTML = getData(str);


      console.log(str);
    };
Velioc
  • 1
  • 3
  • What errors do you get in the console? Did you look at the network tab of your developer tools to see what is going on? What do you do with the returned data? – j08691 Jan 22 '18 at 14:53
  • Why are you calling `showUser()` on change? where is that function? – Luca Kiebel Jan 22 '18 at 14:55
  • Yes. In the console, i see the value get printed out, directly after selecting a select ooption. If I then select another option, the result value from before gets put in the "

    "-Tag.

     – Velioc Jan 22 '18 at 14:56
  • The function show user does: function showUser(str) { document.getElementById("txt").innerHTML = getData(str); console.log(str); }; – Velioc Jan 22 '18 at 14:57
  • getData likely returns `null`, return myData in the onreadystatechange function – Luca Kiebel Jan 22 '18 at 14:58
  • You have to use the callback function ( in ajax ) to update the dom - the ajax function itself will not return the response value as such - not reliably anyway – Professor Abronsius Jan 22 '18 at 14:58
  • ok thank you guys, i put the DOM change in the onreadystatechange function and now it works. – Velioc Jan 22 '18 at 15:08

0 Answers0