0

I am new to web development and am trying to write simple code that changes visibility of an HTML element using JavaScript and AJAX, but my code is not working.

The PHP script I'm running is simple:

    <?php
     echo TRUE;
    ?>

The JavaScript code is:

function getuname() {
  //create_xmlhttpobj();
  var userName = document.getElementById('uName');

  var url = "http://localhost/test.php";
  //script that returns whether username exisits or not

  request.open("GET", url, true);
  request.send(null);
  request.onreadystatechange = updatepage();
  //alert(userName.value);
}

function updatepage() {
  //alert(request.readyState);
  alert(request.readyState);
  //alert(request.responseText);
  if (request.readyState == 4) {
    alert('here123');
    togvis();
  }
}

The statement alert(request.responseText); shows a blank alert box.

Can someone tell me what I might be doing wrong?

freefaller
  • 19,368
  • 7
  • 57
  • 87
Vaibhav
  • 703
  • 1
  • 7
  • 18
  • Since you said you are new to web development and i presume development in general, maybe it would help to look at http://stackoverflow.com/questions/3616181/callback-function-meaning to understand callback functions. – Software Guy Sep 24 '12 at 13:12
  • If that was a direct copy/paste of your JavaScript code, then I would recommend that you get in the habit of formatting it in a much more readable way. It will help you in the long run, and help us more easily understand what you're trying to do :-) – freefaller Sep 24 '12 at 13:27
  • I am carrying on the "conversation" currently taking place in the answer by epascarello... Yes it's highly likely that you're hitting "Same Origin Policy" if the URL in your AJAX code is different than the URL that you used to the load the page. It doesn't matter if they end up requesting information from the same place, the browser does not know that. So do as hongaar mentions, and make sure the URL is the same (including port if necessary) – freefaller Sep 24 '12 at 13:46
  • What is the url that the page is being loaded from? – epascarello Sep 24 '12 at 14:07
  • how do i get around this error?? my php file is in documents/project dir and i'm using wamp – Vaibhav Sep 24 '12 at 14:23
  • Stop asking us to help you, what do you think we're trying to do?! Have you checked that the URL in the browser is the same as the URL in the AJAX? Remember, you don't necessarily have to have a fully qualified URL in the AJAX... simply having `var url = "/test.php";` is enough and removes any ambiguity – freefaller Sep 24 '12 at 16:08

1 Answers1

1

You are calling the function updatepage, not assigning it.

request.onreadystatechange = updatepage();

needs to be

request.onreadystatechange = updatepage;
epascarello
  • 204,599
  • 20
  • 195
  • 236
  • thanx for the real quick response but the alert box still shows empty for request.responseText. – Vaibhav Sep 24 '12 at 13:11
  • @vaibhav - have you tried using something like Firebug for Firefox (my personal favourite), or the built in developer tools in Chrome and IE (press F12)? They will allow you to breakpoint in the javascript and see exactly what the `request` object in your code contains – freefaller Sep 24 '12 at 13:21
  • 1
    Are you checking the responseText inside the if statement? – epascarello Sep 24 '12 at 13:26
  • @freefaller - i checked the console of chrome and it desplayed the following msg XMLHttpRequest cannot load http://localhost/test.php. Origin http://127.0.0.1:8020 is not allowed by Access-Control-Allow-Origin. what did i do wrong? – Vaibhav Sep 24 '12 at 13:34
  • I believe, @vaibhav, that epascarello has hit it on the head... your current (commented) line of `\\alert(request.responseText);` is outside of the `if` statement, and if uncommented in that position will be run before the `readyState == 4`. – freefaller Sep 24 '12 at 13:36
  • The page your script is running from should have the same domain as the script you're trying to load with AJAX. Either load the page http://localhost:8020 for testing, or change the AJAX call to request http://127.0.0.1/test.php. And make sure you're using the right port as well: is your webserver running on port 8020? Then probably the AJAX call should also use port 8020. – Joram van den Boezem Sep 24 '12 at 13:39
  • @freefaller i moved the alert in if statement but still an empty alert box...can it be due to the wrong address of my php script? – Vaibhav Sep 24 '12 at 13:42
  • @vaibhav - I am "moving" this conversation to the comments under your question, as it's not fair to be doing this on epascarello's answer (apologies epascarello for hijacking your answer) – freefaller Sep 24 '12 at 13:47