Page 1 of 1

AJAX troubles...

Posted: Tue Nov 29, 2005 3:45 pm
by Charles256
trying to follow a stupid tutorial..

main page:

Code: Select all

<script src="main.js"></script>
</head>
<body>
<a href="javascript:sndReq('foo')">[foo]</a>
<div id="foo">
  </div>
the javascript.
by the way it's mad at the line in red.

Code: Select all

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

var http = createRequestObject();

function sndReq(action) {
    http.open('get', 'rpc.php?action='+action);
    http.onreadystatechange = handleResponse;
    http.send(null);
}

function handleResponse() {
    if(http.readyState == 4){
        var response = http.responseText;
        var update = new Array();

        if(response.indexOf('|' != -1)) {
            update = response.split('|');
        [color=red]    document.getElementById(update[0]).innerHTML = update[1];[/color]
        }
    }
}
and the php...

Code: Select all

<?
switch($_REQUEST['action']) {
    case 'foo':
      echo "foo|foo done";
      break;
  }

?>
says the elemnt ID has no properties..eh?and man i've never felt like such a damn newb in my life......

Re: AJAX troubles...

Posted: Tue Nov 29, 2005 3:49 pm
by Roja
Charles256 wrote:says the elemnt ID has no properties..eh?and man i've never felt like such a damn newb in my life......
Don't feel bad. The tutorial was coded on IE, which didn't throw an error for that issue.

I have code that fixes it. I'll post it in a few hours.

Re: AJAX troubles...

Posted: Tue Nov 29, 2005 3:52 pm
by Charles256
Roja wrote:
Charles256 wrote:says the elemnt ID has no properties..eh?and man i've never felt like such a damn newb in my life......
Don't feel bad. The tutorial was coded on IE, which didn't throw an error for that issue.

I have code that fixes it. I'll post it in a few hours.
heh it's throwing an error in I.E. actually now.musta been an old version..oh well..i'll handle it tommorow I guess...something I'm doing for the company..going to use AJAX to update the database a bit quicker (they get to see the values right when clicking on the item) may even use it to handle updates..bah..gotta get this simple code working first... thanks.

Posted: Tue Nov 29, 2005 6:12 pm
by Roja
createRequestObject is unchanged.

We add a variable (isBusy), and set it to false. Then we make sure to check it the request is in process or not. If it is, and it is in ready state 4, we process. Otherwise, we try again.

This *does* result in inconsistent update intervals, but it ensures no errors, and no request collisions.

Code: Select all

var http = createRequestObject();
    isBusy = false;

function sndReq(action) {
if (isBusy)
{
        http.onreadystatechange = function () {}
        http.abort();
}
    http.open('get', 'rpc.php?action='+action);
    isBusy = true;
    http.onreadystatechange = handleResponse;
    http.send(null);
}

function handleResponse() {
    if(http.readyState !=4) return;
    isBusy = false;
    if(http.readyState == 4){
        var response = http.responseText;
        var update = new Array();

        if(response.indexOf('|' != -1)) {
            update = response.split('|');
            if (document.getElementById(update[0]) && document.getElementById(update[0]).innerHTML)
            {
                document.getElementById(update[0]).innerHTML = update[1];
            }
        }
    }
}

Posted: Thu Dec 01, 2005 2:57 pm
by Charles256
okay...after fooling around for over an hour...... it still isn't working.
in main.js i snuck in this...

alert(update[0]);
alert(update[1]);
alert(document.getElementById(update[0]));

which alerts foo, foo done, and null.

which means it should know what to look for but it doesn't. argh, WTF?!!!! bout to turn me off from AJAX with a quickness if i can't even get basic javascript to work..someone?anyone?please?:-D

edit: whenever i type in foo into the getElementById it works..yet it should work when i do update[0] cause when i alert it alerts foo also...communism.

ajax.html

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script src="main.js">

</script>
</head>
<body>
<a href="javascript:sndReq('foo')">[foo]</a>
<div id="foo">
</div>
</body>
</html>
rpc.php

Code: Select all

<?
switch($_REQUEST['action']) {
    case 'foo':
      echo "foo|foo done";
      break;
  }

?>
main.js

Code: Select all

function createRequestObject() {
    var ro;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
        ro = new ActiveXObject("Microsoft.XMLHTTP");
    }else{
        ro = new XMLHttpRequest();
    }
    return ro;
}
var http = createRequestObject();
    isBusy = false;

function sndReq(action) {
if (isBusy)
{
        http.onreadystatechange = function () {}
        http.abort();
}
    http.open('get', 'rpc.php?action='+action);
    isBusy = true;
    http.onreadystatechange = handleResponse;
    http.send(null);
}

function handleResponse() {
    if(http.readyState !=4) return;
    isBusy = false;
    if(http.readyState == 4){
        var response = http.responseText;
        var update = new Array();

        if(response.indexOf('|' != -1)) {
            update = response.split('|');
            alert(update[0]);
            alert(update[1]);
            alert(document.getElementById(update[0]));
            if (document.getElementById(update[0]) && document.getElementById(update[0]).innerHTML)
            {
            	alert("help");
                document.getElementById(update[0]).innerHTML = update[1];
            }
        }
    }
}

Posted: Fri Dec 02, 2005 9:44 am
by wtf
Something's wrong with your if statement. If you comment it out you'll get foo to populate.

Code: Select all

function handleResponse() { 
    if(http.readyState !=4) return; 
    isBusy = false; 
    if(http.readyState == 4){ 
        var response = http.responseText; 
        var update = new Array(); 

        if(response.indexOf('|' != -1)) { 
            update = response.split('|'); 
            //alert(update[0]); 
            //alert(update[1]); 
            //alert(document.getElementById(update[0])); 
            //if (document.getElementById(update[0]) && document.getElementById(update[0]).innerHTML) 
            //{ 
               alert("help"); 
                document.getElementById(update[0]).innerHTML = update[1]; 
            //} 
        } 
    } 
}