can't get checkbox to check

[LRW]

Very basic, very simple, but I can't get a checkbox to check when the
value of a text field changes to something greater than 0.

Here's what I have:

THE JAVASCRIPT:

<script language=JavaScript>
<!-- Begin
function sel_comm(comm_val)
{
if (comm_val > 0)
{
document.inhouse-f2.add_comm.checked = true;
}
}
// End -->
</script>

HTML:

<INPUT TYPE="checkbox" NAME="add_comm" ID="add_comm" VALUE="1">
Commission: <INPUT TYPE="text" NAME="item_comm" ID="item_comm"
size="6" onChange="sel_comm(this.value);">

I just don't get why it's not working. I must be missing something,
but I have no idea what. The FORM tag's NAME and ID elements are
"inhouse-f2". What else could it be?

Thanks for any ideas!
Liam

 

[kaeli]

Very basic, very simple, but I can't get a checkbox to check when the
value of a text field changes to something greater than 0.

Actually, not as simple as you'd think.

Textboxes are text. You're comparing text to a number. It's trying to convert
to compare, but what it does it is converts the number to text, so you get
the wrong kind of comparison.

Here's what I have:

THE JAVASCRIPT:

<script language=JavaScript>

type="text/javascript"
language is deprecated.

<!-- Begin
function sel_comm(comm_val)
{
if (comm_val > 0)

if (parseInt(comm_val,10) > 0)

<INPUT TYPE="checkbox" NAME="add_comm" ID="add_comm" VALUE="1">

Commission: <INPUT TYPE="text" NAME="item_comm" ID="item_comm"
size="6" onChange="sel_comm(this.value);">

Also note that the onChange event fires AFTER focus has left the element. I
don't know how good it is to use the 'this' keyword across browsers for that.
Anyone have any comments about that?

Oh, and I think value is undefined if there is no value in the box. So test
what happens if the user deletes the value and then moves focus. You may have
to test for 'not a number' conditions, too.

And your syntax in your function isn't cross-browser, either. If this is for
the internet, your best bet is
document.forms["inhouse-f2"].elements["add_comm"].checked = true;

HTH

--

 

[Michael Winter]

(e-mail address removed) enlightened us with...
[snip]

Textboxes are text. You're comparing text to a number. It's trying to
convert to compare, but what it does it is converts the number to text,
so you get the wrong kind of comparison.

No. Comparisons, with both relational and equality operators, are biased
towards numbers. If one operator is a number and the other is string, the
string is converted to a number, even if that conversion results in NaN.

[snip]

Don't try to hide scripts. It's not necessary any more. If you have some
special requirement, such as the page is parsed by software that can't
cope with scripts, place the script in an external file. Most scripts
should be separated from the document anyway.

if (parseInt(comm_val,10) > 0)

So in light of the above, that isn't needed. It won't do any harm, but
it's redundant. If some bugs I don't know of apply to such a comparison,
using

if((+comm_val) > 0) {

would be more efficient.

Commission: <INPUT TYPE="text" NAME="item_comm" ID="item_comm"
size="6" onChange="sel_comm(this.value);">

Also note that the onChange event fires AFTER focus has left the
element. I don't know how good it is to use the 'this' keyword across
browsers for that. Anyone have any comments about that?

The this operator always refers to the element targeted by the event. The
only exception I know of is when the proprietary attachEvent method is
used. Here, IE doesn't set the this operator correctly, so it refers to
the global object, instead.

If you want to add multiple event listeners in a cross browser way, you
can try:

<URL:http://www.mlwinter.pwp.blueyonder.co.uk/clj/dom-events.js>

It hasn't displayed any problems, but do let me know if you use it and
find any.

Oh, and I think value is undefined if there is no value in the box. So
test what happens if the user deletes the value and then moves focus.
You may have to test for 'not a number' conditions, too.

It should just be an empty string. In that case, the result of the
conversion will be 0.

And your syntax in your function isn't cross-browser, either. If this is
for the internet, your best bet is
document.forms["inhouse-f2"].elements["add_comm"].checked = true;

It's not just "good form" in this case; it's required.

document.inhouse-f2.add_comm.checked = true

should be treated thus:

1) f2.add_comm.checked is subtracted from document.inhouse
2) true is assigned to the result of the operation

Both steps are errors. "f2" and "inhouse" don't exist, so that will stop
execution of the script. If it somehow succeeded, the second step would
fail as a subtraction isn't a valid left-hand expression. This is the
source of the problem.

Mike

 

[kaeli]

No. Comparisons, with both relational and equality operators, are biased
towards numbers. If one operator is a number and the other is string, the
string is converted to a number, even if that conversion results in NaN.

Then is parseInt really only needed when BOTH operands are strings and you
want a number?

TIA

--

 

[Michael Winter]

[snip]

Then is parseInt really only needed when BOTH operands are strings and
you want a number?

Pretty much, yeah, otherwise you'd perform a lexical string comparison.
null and false convert to 0, true converts to 1, and undefined converts to
NaN. Objects also attempt to convert to a number, but if they can't, I
doubt forcing a conversion would do any good.

Mike