value is null or not an object -- after submitting a few times

[AC]

I hope someone can tell me why this is not working. I have a form that
dynamically creates the code below. This is for one product and there are
about 10 to 50 products that are listed depending on what manufacturer the
user selects. After "buying" a few products (4-8) they user gets the error
message: 'QUANTITY.value' is null or not an object.

Do you see a workaround/fix for this?

I posted this on February 19, 2004 under the title 'value is null or not an
object -- after a few submits' and received some syntax tips. The
formatting has been applied and I hope someone can offer some programmatic
help.


HTML (calling code):
=====================================
<tr>
<td width='120' valign='middle' align='center'><font size=-1>Widget
A</font></td>
<td width='50' valign='middle' align='center'><font size=-1>Length
6</font></td>
<td width='54' valign='middle' align='center'><font size=-1>Width
47</font></td>
<td width='50' valign='middle' align='center'><font
size=-1>$4.40</font></td>

<td width='50' valign='middle' align='center'>
<FORM NAME='frmOrder18ea' action='products3.asp'>
<input type='hidden' name='ID_NUM' value='18'>
<input type='hidden' name='NAME' value='Widget A'>
<input type='hidden' name='PRICE' value='4.4'>
<font size=-1><input type='text' size='3' name='QUANTITY' value='0'
onChange='this.value=CKquantity(this.value)'></input>&nbsp;</font>
</FORM>
</TD>
<td width='50' valign='middle' align='center'>
<font size=-1>$99.00 &nbsp;</font>
</td>
<td width='53' valign='middle' align='center'>
<FORM NAME='frmOrder18bx' action='products3.asp'>
<input type='hidden' name='ID_NUM' value='18'>
<input type='hidden' name='NAME' value='Widget A big'>
<input type='hidden' name='PRICE' value='99'>
<font size=-1><input type='text' size='3' name='QUANTITY'
value='0'></input>&nbsp;</font>
</FORM>
</TD>
<td>
<FORM NAME='frmSubmitMe18' action='products3.asp'>
<input type="button" value="Buy" onClick="ProcessBuys(frmOrder18ea,
frmOrder18bx )">
</FORM>
</td>
</tr>
=====================================

Javascript code:
=====================================
<script language="JavaScript">
<!--
function ProcessBuys(first, second) { //, second) { //Handles multiple items

if(first.QUANTITY.value>0){
AddToCart(first);
//alert('bye '+first.name+' bye');
}

if(second.QUANTITY.value>0){
AddToCart(second);
//alert('abt '+first.name+' abt');
}

return false;
}
//-->
</Script>
=====================================


Thanks in advance,
--AC

 

[Ivo]

I hope someone can tell me why this is not working. I have a form that
dynamically creates the code below. This is for one product and there are
about 10 to 50 products that are listed depending on what manufacturer the
user selects. After "buying" a few products (4-8) they user gets the error
message: 'QUANTITY.value' is null or not an object.

You posted a lot of HTML defining three forms, baptized "frmOrder18ea",
"frmOrder18bx" and "frmSubmitMe18". In the first two forms we do indeed find
elements named "QUANTITY". The first of those even calls a javascript
function "CKquantity()" onchange.
You also posted some javascript, but not function CKquantity(). The onsubmit
function ProcessBuys() that we see expects two global variables "first" and
"second", each with a property called "QUANTITY" with a property called
"value". It looks like CKquantity() should prepare these variable but
somehow doesn't.
The whole setup is a bit funny, two forms without submit element, and a
third to submit them. I'm sure there is (or has been) a reason for that.
Also, giving global variables the same names as your form elements is asking
for trouble. There may be hundreds of form elements called Q on a page, but
there is variable Q until explicitly set.
HTH
Ivo

 

[Ivo]

I hope someone can tell me why this is not working. I have a form that
dynamically creates the code below. This is for one product and there are
about 10 to 50 products that are listed depending on what manufacturer the
user selects. After "buying" a few products (4-8) they user gets the error
message: 'QUANTITY.value' is null or not an object.

You posted a lot of HTML defining three forms, baptized "frmOrder18ea",
"frmOrder18bx" and "frmSubmitMe18". In the first two forms we do indeed find
elements named "QUANTITY". The first of those even calls a javascript
function "CKquantity()" onchange.
You also posted some javascript, but not function CKquantity(). The onsubmit
function ProcessBuys() that we see expects two global variables "first" and
"second", each with a property called "QUANTITY" with a property called
"value". It looks like CKquantity() should prepare these variable but
somehow doesn't.
The whole setup is a bit funny, two forms without submit element, and a
third to submit them. I'm sure there is (or has been) a reason for that.
Also, giving global variables the same names as your form elements is asking
for trouble. There may be hundreds of form elements called Q on a page, but
there is variable Q until explicitly set.
HTH
Ivo

 

[AC]

Please see the response to your original message.

<snip/>

 

[AC]

Ivo,

Thanks for the reply. The two forms (frmOrderXXXX) are sent to the
ProcessBuys function from the frmSubmitMeXX form using the button. Once the
form objects are sent to the ProcessBuys function it uses them as "First"
and "Second" variables. These objects are used to encapsulate the
properties (name, price, quantity, etc) and send them to another function.

The problem is that after a few "buys" (submissions) the form objects do not
contain their properties when sent to the ProcessBuys function. Is the
number of forms a problem? I can have up to about 150 total (50 products x
3 forms).

The CKquantity function performs well so it does not matter for this
problem.

Thanks again,
--AC

 

[Michael Winter]

[snip]

You posted a lot of HTML defining three forms, baptized "frmOrder18ea",
"frmOrder18bx" and "frmSubmitMe18". In the first two forms we do indeed
find elements named "QUANTITY". The first of those even calls a
javascript function "CKquantity()" onchange.
You also posted some javascript, but not function CKquantity(). The
onsubmit function ProcessBuys() that we see expects two global
variables "first" and "second", [...]

Those are function arguments, which makes them local, not global.

[...] each with a property called "QUANTITY" with a property called
"value". It looks like CKquantity() should prepare these variable but
somehow doesn't.
The whole setup is a bit funny, two forms without submit element, and a
third to submit them. I'm sure there is (or has been) a reason for that.

I agree that the arrangement is strange. The better way to organise groups
of controls is using the FIELDSET element or, if you must, tables. In
either case, there should only be one FORM element. However, without
seeing the document there isn't a way to reliably say which is better.

Also, giving global variables the same names as your form elements is
asking for trouble.

The use of the identifiers frmOrder18ea and frmOrder18bx in the call

ProcessBuys(frmOrder18ea,frmOrder18bx)

is a badly executed attempt to pass references of the respective forms to
the function, ProcessBuys(). It is not using global variables with the
same name as forms, it using form names as global variables (subtle
difference), and IE practice. What the OP should use is:

ProcessBuys(document.frmOrder18ea,document.frmOrder18bx)

or

ProcessBuys(document.forms['frmOrder18ea'],
document.forms['frmOrder18bx'])

Without doing this, users of non-IE browsers will not be able to use this
functionality, and probably, the page as a whole.

There may be hundreds of form elements called Q on a page, but there
is variable Q until explicitly set.

I can't honestly say I know what you mean there.

[snip]

Mike

 

[Michael Winter]

I hope someone can tell me why this is not working. I have a form that
dynamically creates the code below. This is for one product and there
are about 10 to 50 products that are listed depending on what
manufacturer the user selects. After "buying" a few products (4-8)
they user gets the error message: 'QUANTITY.value' is null or not an
object.

Do you see a workaround/fix for this?

Nothing that you have posted in this thread, with one (or possibly two)
exceptions, should cause this problem.

I posted this on February 19, 2004 under the title 'value is null or not
an object -- after a few submits' and received some syntax tips. The
formatting has been applied and I hope someone can offer some
programmatic help.

As such, I can do little more at the moment than provide more syntax tips.
Do read them, though.

[snip]

<td width='50' valign='middle' align='center'>
<FORM NAME='frmOrder18ea' action='products3.asp'>
<input type='hidden' name='ID_NUM' value='18'>
<input type='hidden' name='NAME' value='Widget A'>
<input type='hidden' name='PRICE' value='4.4'>
<font size=-1><input type='text' size='3' name='QUANTITY' value='0'
onChange='this.value=CKquantity(this.value)'></input>&nbsp;</font>

There is no such thing as a closing INPUT tag. Get rid of it.

[snip]

<td width='53' valign='middle' align='center'>
<FORM NAME='frmOrder18bx' action='products3.asp'>
<input type='hidden' name='ID_NUM' value='18'>
<input type='hidden' name='NAME' value='Widget A big'>
<input type='hidden' name='PRICE' value='99'>
<font size=-1><input type='text' size='3' name='QUANTITY'
value='0'></input>&nbsp;</font>

The same criticism here as above.

[snip]

<FORM NAME='frmSubmitMe18' action='products3.asp'>
<input type="button" value="Buy" onClick="ProcessBuys(frmOrder18ea,
frmOrder18bx )">

This call is likely to fail in browsers besides IE. You should not use
element names as global references. Instead use either,

ProcessBuys(document.frmOrder18ea,document.frmOrder18bx)

or

ProcessBuys(document.forms['frmOrder18ea'],
document.forms['frmOrder18bx'])

[snip]

<script language="JavaScript">

The type attribute is required. The language attribute is deprecated. Use:

<!--

Script hiding is an obsolete practice. Remove the SGML comment delimiters.

function ProcessBuys(first, second) { //, second) { //Handles multiple
items

if(first.QUANTITY.value>0){

It might be more appropriate to convert the text string, value, into a
number before performing that comparison. I'm not sure off hand how it
will be treated, especially if value contains non-numeric characters.

[snip]

I don't think that the number of forms in the page can cause what is
happening. If it is that, then the browser is broken. Even so, it might be
an idea to do it anyway as it's poor use of HTML.

As I seriously doubt the changes above will yield anything except better
compatibility and a more valid document, you'll have to post more code or
even a URL.

Mike

 

[AC]

Sent you the page in an email.

--AC

 

[AC]

Michael Winter figured it out. I have to look at why the code is doing this
but the solution is as follows:

=======================
Initially, I couldn't reproduce the problem but with some luck and the
trusty alert box, I found the cause: you don't use unique names for the
forms in all cases. For example, Spanish (Each) uses the form
name, "frmOrder40ea". This name is also used by Carlos #3. When you
pass document.forms['frmOrder40ea'] to ProcessBuys(), you pass a
collection of all form elements with that name, not a form reference.

There are two solutions:

1) Ensure that all form names are unique.
2) Alter the call with all duplicates so that you index the array. With
the above example, you would call ProcessBuys() with
document.forms['frmOrder40ea'][0] for Spanish, and
document.forms['frmOrder40ea'][1] for Carlos.

Good luck,
Mike
=======================

I will now have to see why my server-side code is creating a form name
twice. It shouldn't as I am incrementing the form numbers when I create
them.

Thank you Michael again.