new to AJAX -- can you do this?

[Frances]

I literally started learning AJAX just last weekend.. I have this page,
http://www.francesdelrio.com/ajax/db2.html, where I'm essentially doing
what's here, http://www.w3schools.com/ajax/ajax_source.asp, only my
array is populated from info pulled from db.. I added interface to HTML
interface to insert info into db; info gets inserted in to db in a
servlet then servlet redirects back to HTML interface, where if user
types something from array (array of First Names column in db table) it
gets printed about two lines down..

now what I would like to do, if possible, is on top, instead of putting
an input type-text, do a select obj and populate it with all First Names
in db table (which are in array), like here,
http://www.francesdelrio.com/ajax/getData3.jsp.. what I tried:

I repeated this function

function stateChanged() {
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {
document.getElementById("txtHint").innerHTML=xmlHttp.responseText
}
}

giving it a diff. name (stateChanged2()) and changed id for div... and
call function for populating sel obj when pg loads, but select obj is
not appearing.. (I have no idea if you can do this, if with AJAX you can
only change state upon user input and not when HTML pg loads.. but it
seems to me I should be able to call an AJAX function -- like any
function -- when pg loads..)

so: have two 'main' functions (for lack of a better term -- I mean the
functions that call the XMLHttpRequest obj and call stateChanged()
functions..) one for printing sel Obj w/info from db when pg loads and
one for printing text on pg according to what user selects in sel obj..
each function calls a diff JSP (don't know yet how to do this with
both functions calling same JSP, as this line

document.getElementById("txtHint").innerHTML=xmlHttp.responseText

just prints whatever is output in JSP (don't know yet if/how you say,
here print this part of JSP and here print this other part of JSP..) I
hope all this makes sense.. all relevant code is JavaScript, so you can
easily view... pg where I'm trying to do all this is
http://www.francesdelrio.com/ajax/db3.html

many thanks..
Frances

 

[Frances]

I literally started learning AJAX just last weekend.. I have this page,
http://www.francesdelrio.com/ajax/db2.html, where I'm essentially doing
what's here, http://www.w3schools.com/ajax/ajax_source.asp, only my
array is populated from info pulled from db.. I added interface to HTML
interface to insert info into db; info gets inserted in to db in a
servlet then servlet redirects back to HTML interface, where if user
types something from array (array of First Names column in db table) it
gets printed about two lines down..

now what I would like to do, if possible, is on top, instead of putting
an input type-text, do a select obj and populate it with all First Names
in db table (which are in array), like here,
http://www.francesdelrio.com/ajax/getData3.jsp.. what I tried:

I repeated this function

function stateChanged() {
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {
document.getElementById("txtHint").innerHTML=xmlHttp.responseText
}
}

giving it a diff. name (stateChanged2()) and changed id for div... and
call function for populating sel obj when pg loads, but select obj is
not appearing.. (I have no idea if you can do this, if with AJAX you can
only change state upon user input and not when HTML pg loads.. but it
seems to me I should be able to call an AJAX function -- like any
function -- when pg loads..)

so: have two 'main' functions (for lack of a better term -- I mean the
functions that call the XMLHttpRequest obj and call stateChanged()
functions..) one for printing sel Obj w/info from db when pg loads and
one for printing text on pg according to what user selects in sel obj..
each function calls a diff JSP (don't know yet how to do this with both
functions calling same JSP, as this line

document.getElementById("txtHint").innerHTML=xmlHttp.responseText

just prints whatever is output in JSP (don't know yet if/how you say,
here print this part of JSP and here print this other part of JSP..) I
hope all this makes sense.. all relevant code is JavaScript, so you can
easily view... pg where I'm trying to do all this is
http://www.francesdelrio.com/ajax/db3.html

many thanks..
Frances

my problem probably is I don't understand this line

if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {

(all AJAX examples I've seen say 'readyState==4' -- what does readyState
'4' mean? and what does readyState 'complete' mean? thanks again..

 

[freakismarco]

it checks the state of your request object...

 

[brivad]

my problem probably is I don't understand this line

if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {

(all AJAX examples I've seen say 'readyState==4' -- what does readyState
'4' mean? and what does readyState 'complete' mean? thanks again..

4 is the value of readyState, it tell you that the loading of the
requested document is complete. "complete" is a constant defined to be
= 4, then the same. the possible values of state are:

var READY_STATE_UNINITIALITED=0;
var READY_STATE_LOADING=1;
var READY_STATE_LOADED=2;
var READY_STATE_INTERACTIVE=3;
var READY_STATE_COMPLETE=4;

I suggest you to read Ajax In Action by Dave Crane, I'm reding it and
it's very clarifying!
bye

 

[Frances]

thanks for yr response.. my select obj displays ok when pg loads..
http://www.francesdelrio.com/ajax/db3.html
however, the rest of the page is not displaying, AND when change
selection on sel obj I get error:

document.getElementById("txtHint") has no properties

as if that div were not in HTML, but it is... would appreciate
suggestions.. thank you..

Frances