Grab ElementbyID from innerhtml

[fmdevelopertim]

New to AJAX so sorry if this is simple.

Have a page that gives the user a list to select a brand. Based on the
brand selected it shows a list of sizes available using the following
code:

function handleStateChan ge() {
if(xmlHttp.read yState == 4) {
if(xmlHttp.stat us == 200) {
document.getEle mentById("serve rResponse").inn erHTML =
xmlHttp.respons eText;
}
}
}

The next step is show a list of all items available that match that
brand and size. Using the following code to grab the values selected:

function createQueryStri ng2() {
var Brand = document.getEle mentById("Brand ").value;
var Size = document.getEle mentById("size" ).value;

var queryString = "brand=" + Brand + "&size=" + Size;

return queryString;
}

The page works exactly as expected in FireFox, but IE is not capturing
the size element from the innerHTML. Added display vaiable functions to
the PHP page that is being rendered and the brand variable is there,
the size variable is not.

Thanks for any help.

[Martin Honnen]

fm************@ gmail.com wrote:

function createQueryStri ng2() {
var Brand = document.getEle mentById("Brand ").value;
var Size = document.getEle mentById("size" ).value;

var queryString = "brand=" + Brand + "&size=" + Size;

return queryString;
}

The page works exactly as expected in FireFox, but IE is not capturing
the size element from the innerHTML. Added display vaiable functions to
the PHP page that is being rendered and the brand variable is there,
the size variable is not.

I can only guess from the name of that function that you somewhere call
it to create a querystring for a HTTP GET request URL.
What do you mean by "IE is not capturing the size element from the
innerHTML"? Do you create the element with id="size" by assigning to the
innerHTML of another element? Do you get a script error on
document.getEle mentById("size" ).value
with IE? If there is no element with id="size" then that expression
should give a script error as then getElementById returns null and you
can't access .value on null. Do you get a script error?
--

Martin Honnen
http://JavaScript.FAQTs.com/

[fmdevelopertim]

Full Java below:

var xmlHttp;

function createXMLHttpRe quest() {
if (window.ActiveX Object) {
xmlHttp = new ActiveXObject(" Microsoft.XMLHT TP");
}
else if (window.XMLHttp Request) {
xmlHttp = new XMLHttpRequest( );
}
}

function createQueryStri ng() {
var Brand = document.getEle mentById("Brand ").value;

var queryString = "brand=" + Brand;

return queryString;
}

function doRequestUsingG ET() {
createXMLHttpRe quest();

var queryString = "response.php?" ;
queryString = queryString + createQueryStri ng() ;
xmlHttp.onready statechange = handleStateChan ge;
xmlHttp.open("P ost", queryString, true);
xmlHttp.send(nu ll);
}

function handleStateChan ge() {
if(xmlHttp.read yState == 4) {
if(xmlHttp.stat us == 200) {
document.getEle mentById("serve rResponse").inn erHTML =
xmlHttp.respons eText;
}
}
}

function createQueryStri ng2() {
var Brand = document.getEle mentById("Brand ").value;
var Size = document.getEle mentById("size" ).value;

var queryString = "brand=" + Brand + "&size=" + Size;

return queryString;
}

function doRequestUsingG ET2() {
createXMLHttpRe quest();

var queryString = "listing.ph p?";
queryString = queryString + createQueryStri ng2() ;
xmlHttp.onready statechange = handleStateChan ge2;
xmlHttp.open("P ost", queryString, true);
xmlHttp.send(nu ll);
}

function handleStateChan ge2() {
if(xmlHttp.read yState == 4) {
if(xmlHttp.stat us == 200) {
document.getEle mentById("avail able").innerHTM L =
xmlHttp.respons eText;
}
}
}
The page result.php just builds a pull down list - '<select id="size"
onchange="doReq uestUsingGET2() ;" name="size">

I need to grab the value of <select id="Brand"
onchange="doReq uestUsingGET(); " name="Brand" tabindex="1"> (working
well on all browsers) and the value of Size from the innerhtml call.

These 2 values are used in listing.php which builds a table of the
results.
Martin Honnen wrote:

fm************@ gmail.com wrote:

function createQueryStri ng2() {
var Brand = document.getEle mentById("Brand ").value;
var Size = document.getEle mentById("size" ).value;

var queryString = "brand=" + Brand + "&size=" + Size;

return queryString;
}

The page works exactly as expected in FireFox, but IE is not capturing
the size element from the innerHTML. Added display vaiable functions to
the PHP page that is being rendered and the brand variable is there,
the size variable is not.

I can only guess from the name of that function that you somewhere call
it to create a querystring for a HTTP GET request URL.
What do you mean by "IE is not capturing the size element from the
innerHTML"? Do you create the element with id="size" by assigning to the
innerHTML of another element? Do you get a script error on
document.getEle mentById("size" ).value
with IE? If there is no element with id="size" then that expression
should give a script error as then getElementById returns null and you
can't access .value on null. Do you get a script error?
--

Martin Honnen
http://JavaScript.FAQTs.com/

[Martin Honnen]

fm************@ gmail.com wrote:

function createQueryStri ng2() {
var Brand = document.getEle mentById("Brand ").value;
var Size = document.getEle mentById("size" ).value;

Can you answer that:

Do you get a script error on
document.getEle mentById("size" ).value
with IE? If there is no element with id="size" then that expression
should give a script error as then getElementById returns null and you
can't access .value on null. Do you get a script error?

If there is no script error then IE finds the element just fine by its
id. Thus if there is no script error then the problem is not with
getElementById.

--

Martin Honnen
http://JavaScript.FAQTs.com/

[fmdevelopertim]

No script error.

I display the two variables in the PHP file and it displays:

Selected Brand is 19
Selected size is

The size variable is empty. It is being passed as:

var queryString = "brand=" + Brand + "&size=" + Size;
var queryString = "listing.ph p?";
queryString = queryString + createQueryStri ng2() ;
Martin Honnen wrote:

fm************@ gmail.com wrote:

function createQueryStri ng2() {
var Brand = document.getEle mentById("Brand ").value;
var Size = document.getEle mentById("size" ).value;

Can you answer that:

Do you get a script error on
document.getEle mentById("size" ).value
with IE? If there is no element with id="size" then that expression
should give a script error as then getElementById returns null and you
can't access .value on null. Do you get a script error?

If there is no script error then IE finds the element just fine by its
id. Thus if there is no script error then the problem is not with
getElementById.

--

Martin Honnen
http://JavaScript.FAQTs.com/

[Martin Honnen]

fm************@ gmail.com wrote:

I display the two variables in the PHP file and it displays:

Selected Brand is 19
Selected size is

The size variable is empty. It is being passed as:

var queryString = "brand=" + Brand + "&size=" + Size;
var queryString = "listing.ph p?";
queryString = queryString + createQueryStri ng2() ;

Hard to tell without seeing a test case. Is the element with id="size" a
single or multiple select element? Does it render properly? What does
document.getEle mentById('size' ).selectedIndex
give?

--

Martin Honnen
http://JavaScript.FAQTs.com/

[fmdevelopertim]

Thanks for the reply - I figured it out based on your comments. The
list rendered correctly but the value element was not correctly
defined.

I greatly appreciate your assistance!
Martin Honnen wrote:

fm************@ gmail.com wrote:

I display the two variables in the PHP file and it displays:

Selected Brand is 19
Selected size is

The size variable is empty. It is being passed as:

var queryString = "brand=" + Brand + "&size=" + Size;
var queryString = "listing.ph p?";
queryString = queryString + createQueryStri ng2() ;

Hard to tell without seeing a test case. Is the element with id="size" a
single or multiple select element? Does it render properly? What does
document.getEle mentById('size' ).selectedIndex
give?

--

Martin Honnen
http://JavaScript.FAQTs.com/