CodingForums.com

CodingForums.com (http://www.codingforums.com/index.php)
-   Ajax and Design (http://www.codingforums.com/forumdisplay.php?f=55)
-   -   hi guys need help with a simple ajax script please (http://www.codingforums.com/showthread.php?t=249282)

gerble1000 01-19-2012 09:04 PM

hi guys need help with a simple ajax script please
 
i need the simplest way to add to my javascript code a way of getting data from a text file in the same directory as the index.html and putting the data into a variable called data1 to be used by the rest of the script
any ideas

devnull69 01-20-2012 07:40 AM

Yes, google for "simple Ajax example"

gerble1000 01-21-2012 04:12 PM

i cant seem to find an example that does what i need

devnull69 01-21-2012 11:11 PM

i cant seem to believe that

This is what came up as the very first result googling for Ajax example
Code:

var myvar = "";
var http = XMLHttpRequest();
http.open('GET', 'datatextfile.txt', true);
http.onreadystatechange = function() {
  if(http.readyState == 4 && http.status == 200)
      myvar = http.responseText;
}
http.send(null);


gerble1000 01-22-2012 05:52 PM

ok thanx
i have played with this and i am finding it a problem...here is my code

Code:

<script type="text/javascript">
function changecolor()
{
var myvar = "";

        var http = createRequestObject();

        function createRequestObjecte() {
                var objAjax;
                var browser = navigator.appName;
                if (browser == "Microsoft Internet Explorer"){
                        objAjax = new ActiveXObject("Microsoft.XMLHTTP");
                }else{
                        objAjax = new XMLHttpRequest();
                }


                http.open('get',text1.txt,true);
                http.send(null);
                myvar = http.responseText;

        }









var tcolor1 = myvar;
var tcolor2 = "pink";
var tcolor3 = "blue";
var tcolor4 = "orange";





document.getElementById('color1').style.color = tcolor1;
document.getElementById('color2').style.color = tcolor1;
document.getElementById('color3').style.color = tcolor1;
document.getElementById('color4').style.color = tcolor1;
document.getElementById('color5').style.color = tcolor1;
document.getElementById('color6').style.color = tcolor1;
document.getElementById('color7').style.color = tcolor1;
document.getElementById('color8').style.color = tcolor1;

}
</script>

could you please tell me what i am doing wrong

devnull69 01-22-2012 10:42 PM

Yes, you did not use my example above. Instead you removed the (important) callback onreadystatechange and treated the responseText from an asynchronous request (third parameter of open is true) as if it was a synchronous one ... which obviously doesn't work. Additionally, starting from IE7 you do not need a browser switch any more as every modern browser recognizes the XMLHttpRequest object.

gerble1000 01-22-2012 10:52 PM

i know i dont know as much as you but i am trying my best...
im more familiar with perl and c++.. could you please point out what i have done wrong and please help correct.
i supply people with information on another forum for help with other languages.
could you be a professional and help please

Spidey1980 01-23-2012 03:31 AM

http://bookofjavascript.com/Chapter16/Fig16-15.txt HTML that uses the following PHP
http://bookofjavascript.com/Chapter16/readTextFile.txt PHP file that opens and reads files

devnull69 01-23-2012 06:59 AM

Please try to adhere as close as possible to my first example ... and if it doesn't work, please come back with your rewritten code. Then we will find the problem.

The goal of this forum is not to write the code for you but to guide you to help yourself as good as possible.

Code:

var myvar = "";
var http = XMLHttpRequest();
http.open('GET', 'datatextfile.txt', true);
http.onreadystatechange = function() {
  if(http.readyState == 4 && http.status == 200)
      myvar = http.responseText;
}
http.send(null);

Hint: The first A in Ajax means "asynchronous". I think coming from C++ you should be aware of this construct. Essentially it means that the normal Javascript program flow continues while "some background task" is still running. As soon as the background task triggers some event (in this case the change of the readyState), it will call a so-called "callback function" (onreadystatechange). readyState==4 says: Request complete, status==200 says HTTP OK. In that case you can grab the PHP script output from responseText and do with it whatever you want

gerble1000 01-24-2012 11:07 PM

i dont get it im racking my brains for days now and still cant get this to work

here is what i have

Code:

<script type="text/javascript">
function changecolor()





{
var myvar = "";
var http = XMLHttpRequest();
http.open('GET', 'text1.txt', true);
http.onreadystatechange = function() {
  if(http.readyState == 4 && http.status == 200)
      myvar = http.responseText;
}
http.send(null);








var tcolor1 = myvar;
var tcolor2 = "pink";
var tcolor3 = "blue";
var tcolor4 = "orange";





document.getElementById('color1').style.color = tcolor1;
document.getElementById('color2').style.color = tcolor1;
document.getElementById('color3').style.color = tcolor1;
document.getElementById('color4').style.color = tcolor1;
document.getElementById('color5').style.color = tcolor1;
document.getElementById('color6').style.color = tcolor1;
document.getElementById('color7').style.color = tcolor1;
document.getElementById('color8').style.color = tcolor1;


devnull69 01-25-2012 11:52 AM

This is a common mistake. Outside of onreadystatechange the "myvar" variable remains undefined, because this code will be executed BEFORE the request has finished.

Conclusion: Everything you want to do depending on the result of the request has to be (started from) inside the onreadystatechange callback

Code:

var myvar = "";
var http = XMLHttpRequest();
http.open('GET', 'text1.txt', true);
http.onreadystatechange = function() {
  if(http.readyState == 4 && http.status == 200) {
      myvar = http.responseText;
      var tcolor1 = myvar;
      var tcolor2 = "pink";
      var tcolor3 = "blue";
      var tcolor4 = "orange";
      document.getElementById('color1').style.color = tcolor1;
      document.getElementById('color2').style.color = tcolor1;
      document.getElementById('color3').style.color = tcolor1;
      document.getElementById('color4').style.color = tcolor1;
      document.getElementById('color5').style.color = tcolor1;
      document.getElementById('color6').style.color = tcolor1;
      document.getElementById('color7').style.color = tcolor1;
      document.getElementById('color8').style.color = tcolor1;
  }
}
http.send(null);



All times are GMT +1. The time now is 07:04 AM.

Powered by vBulletin®
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.