Blackberry-specific problem

[Jason C]

I'm having a problem on my site that seems to ONLY occur when the user has a Blackberry. I have an iPhone and an Android, but no Blackberry, so naturally, I have no way of duplicating the problem.

This is on a classifieds page. The user will select a category from a SELECT menu, then if necessary, a second SELECT menu will pop up for a subcategory.

Further down the page, the user has a series of checkboxes, where they can select to show the listing under multiple sections of the site.

The problem, though, is that with Blackberry users, one of the values of the checkboxes (seemingly random) will come through as the value of the subcategory.

I've tried to duplicate this with IE, FF, Chrome, Safari, Opera, iPhone, and Android, with no luck. The only similarity between the submissions with errors is that the user is using a Blackberry, so I'm guessing that it's either something with the phone, or an error somewhere in the code that's onlybeing picked up by Blackberry.

FWIW, the page "almost" validates via W3.org. The only error that it finds is that I use <p></p> to let the user increase the font size of the page, but it's used within several inline tags. This should be irrelevant for thiserror, though.

The relevant code is below. Do you guys see a flaw anywhere that could be causing this?

// The JavaScript
//
// this is used later in the script, but I'm
// leaving it here in case it's somehow relevant
var has_subcat = false;

// Set subcategories
function getSubcat(cat) {
var list_cat = new Array();
var show_msg;

// Modified for this post
// The actual script creates several arrays, where the
// list_cat[index] represents a category (like "Autos"),
// and the values represent a subcategory (like "Cars")
list_cat['Autos'] = new Array (
"Cars",
"Trucks, Vans, and SUVs",
"Motorcycles / ATVs",
"Campers / Boats",
"Farm Equipment",
"Parts and Accessories"
);

if (cat && (list_cat[cat].length > 0)) {
has_subcat = true;

show_msg = "<select name='subcat' size='1'>";
show_msg += "<option value=''>Choose a subcategory<\/option>";

for (n=0; n < list_cat[cat].length; n++)
show_msg += "<option value='" + list_cat[cat][n] + "'>"
+ list_cat[cat][n] + "<\/option>";

show_msg += "<\/select>";
}

if (document.getElementById)
document.getElementById('subcategory').innerHTML = show_msg;

else if (document.all)
document.all[subcategory].innerHTML = show_msg;

else if (document.layers) {
document.layers[subcategory].document.write(show_msg);
document.layers[subcategory].document.close();
}
}


// The HTML part of the SELECT menu
<select name="category" size="1" onChange="getSubcat(this.value)">
<option value="">Choose a Category...</option>

// Abbreviated for this post. Several options are
// usually shown here
<option value="Autos">Autos</option>
</select>
<div id="subcategory"></div>


// The HTML part of the checkboxes; roughly 40 of these
// are actually shown
// "option" is intended as a variable here, so the
// live page doesn't actually say "option"
<div style="float:left">
<input type="checkbox" name="more" id="option" value="option">
Option
</div>

 

[Jeff North]

On Tue, 7 Feb 2012 20:02:47 -0800 (PST), in comp.lang.javascript Jason
C <[email protected]>
<3969324.4567.1328673767667.JavaMail.geo-discussion-forums@vbbfd4>
wrote:

| I'm having a problem on my site that seems to ONLY occur when the user has a Blackberry. I have an iPhone and an Android, but no Blackberry, so naturally, I have no way of duplicating the problem.
|
| This is on a classifieds page. The user will select a category from a SELECT menu, then if necessary, a second SELECT menu will pop up for a subcategory.
|
| Further down the page, the user has a series of checkboxes, where they can select to show the listing under multiple sections of the site.
|
| The problem, though, is that with Blackberry users, one of the values of the checkboxes (seemingly random) will come through as the value of the subcategory.
|
| I've tried to duplicate this with IE, FF, Chrome, Safari, Opera, iPhone, and Android, with no luck. The only similarity between the submissions with errors is that the user is using a Blackberry, so I'm guessing that it's either something with the phone, or an error somewhere in the code that's only being picked up by Blackberry.
|
| FWIW, the page "almost" validates via W3.org. The only error that it finds is that I use <p></p> to let the user increase the font size of the page, but it's used within several inline tags. This should be irrelevant for this error, though.
|
| The relevant code is below. Do you guys see a flaw anywhere that could be causing this?

I don't know if this will work but ...

| // The JavaScript
| //
| // this is used later in the script, but I'm
| // leaving it here in case it's somehow relevant
| var has_subcat = false;

The variable is initialised here.

| // Set subcategories
| function getSubcat(cat) {
| var list_cat = new Array();
| var show_msg;
|
| // Modified for this post
| // The actual script creates several arrays, where the
| // list_cat[index] represents a category (like "Autos"),
| // and the values represent a subcategory (like "Cars")
| list_cat['Autos'] = new Array (
| "Cars",
| "Trucks, Vans, and SUVs",
| "Motorcycles / ATVs",
| "Campers / Boats",
| "Farm Equipment",
| "Parts and Accessories"
| );
|
| if (cat && (list_cat[cat].length > 0)) {
| has_subcat = true;

and reset here. On the first run through all will be well but on
subsequent runs the variable will always be set to true.

At the beginning of the function, after the var ... set the value back
to false.

| show_msg = "<select name='subcat' size='1'>";
| show_msg += "<option value=''>Choose a subcategory<\/option>";
|
| for (n=0; n < list_cat[cat].length; n++)
| show_msg += "<option value='" + list_cat[cat][n] + "'>"
| + list_cat[cat][n] + "<\/option>";
|
| show_msg += "<\/select>";
| }
|
| if (document.getElementById)
| document.getElementById('subcategory').innerHTML = show_msg;
|
| else if (document.all)
| document.all[subcategory].innerHTML = show_msg;
|
| else if (document.layers) {
| document.layers[subcategory].document.write(show_msg);
| document.layers[subcategory].document.close();
| }
| }
|
|
| // The HTML part of the SELECT menu
| <select name="category" size="1" onChange="getSubcat(this.value)">
| <option value="">Choose a Category...</option>
|
| // Abbreviated for this post. Several options are
| // usually shown here
| <option value="Autos">Autos</option>
| </select>
| <div id="subcategory"></div>
|
|
| // The HTML part of the checkboxes; roughly 40 of these
| // are actually shown
| // "option" is intended as a variable here, so the
| // live page doesn't actually say "option"
| <div style="float:left">
| <input type="checkbox" name="more" id="option" value="option">
| Option
| </div>

 

[Jason C]

On Wednesday, February 8, 2012 12:16:20 AM UTC-5, Jeff North wrote:

and reset here. On the first run through all will be well but on
subsequent runs the variable will always be set to true.

At the beginning of the function, after the var ... set the value back
to false.

I see what you're saying, and good catch! I'm not sure if that would impact this error, but I've changed it, so we'll find out.

Luckily/unluckily, I only have 1 or 2 ads come through a day that have this error (out of about 1,000 daily ads), so the only way I'll know if this fixed it is to wait to see if this error comes through again.

 

[Thomas 'PointedEars' Lahn]

For goodness' sake, people, either you learn about Google Groups'
limitations and work around them every time, or you just DO NOT USE Google
Groups for posting. The decoded lines in the precursor are up to 331
characters long. This is unacceptable. The acceptable, compatible limit is
80 characters or less (see the FAQ). If it wasn't for the word-wrapping
capabilities of some newsreaders (like mine), the posting would be simply
unreadable.

[…]
The problem, though, is that with Blackberry users, one of the values of
the checkboxes (seemingly random) will come through as the value of the
subcategory.

That is a non-description, which will probably result in a non-answer (from
a limited point of view).

I've tried to duplicate this with IE, FF, Chrome, Safari, Opera, iPhone,
and Android, with no luck.

There are hundreds of versions of those browsers and dozens of platforms
they can run on. Even on Android for which there are several versions and
ROMs, there are several browsers with several versions. I am using Dolphin
Browser HD 7.3.0 most of the time, for example.

The only similarity between the submissions with errors is that the user
is using a Blackberry, so I'm guessing that it's either something with the
phone, or an error somewhere in the code that's only being picked up by
Blackberry.

Again, which one *exactly*?

FWIW, the page "almost" validates via W3.org. The only error that it finds
is that I use <p></p> to let the user increase the font size of the page,
but it's used within several inline tags. This should be irrelevant for
this error, though.

With invalid markup, all bets are off. Especially with DOM scripting like
this.

The relevant code is below. Do you guys see a flaw anywhere that could be
causing this?

// The JavaScript

Please get informed about what JavaScript is and is not. Useful keywords
include "Netscape", "Mozilla.org", "JavaScript", "JScript", "Google V8",
"JavaScriptCore", and "ECMAScript". Avoid books, take blogs and Wikipedia
with a handful of salt.

// this is used later in the script, but I'm
// leaving it here in case it's somehow relevant
var has_subcat = false;

Avoid global variables unless you absolutely need them. Post the code that
you use, not something else. And do not use code that you do not understand
(code that in this case is obviously written by someone who does not
understand these programming languages either).

// Set subcategories
function getSubcat(cat) {
var list_cat = new Array();

You do not want an Array instance (see below), you want an Object instance:

var list_cat = new Object();

or

var list_cat = {};

var show_msg;

// Modified for this post
// The actual script creates several arrays, where the
// list_cat[index] represents a category (like "Autos"),
// and the values represent a subcategory (like "Cars")
list_cat['Autos'] = new Array ( ^^^^^^^
"Cars",
"Trucks, Vans, and SUVs",
"Motorcycles / ATVs",
"Campers / Boats",
"Farm Equipment",
"Parts and Accessories"
);

if (cat && (list_cat[cat].length > 0)) {

This throws an exception if `list_cat[cat]' evaluates to `undefined'.

has_subcat = true;

That assigns to the global variable, unchanging unless modified elsewhere.

show_msg = "<select name='subcat' size='1'>";
show_msg += "<option value=''>Choose a subcategory<\/option>";

If you must, e. g.

show_msg = "<select name='subcat' size='1'>"

for (n=0; n < list_cat[cat].length; n++)

`n' is not declared (with `var'), so the assignment will leak into outer
scopes (side-effects include throwing exceptions). Use

"use strict";

on the top of the code or the function body to find such mistakes earlier in
recent browsers (implementing ECMAScript Ed. 5). Use semantic validation
elsewhere.

It is possible that this is the cause of the problem that *you* have found.

An optimization:

for (var n = 0, len = list_cat[cat].length; n < len; ++n)

show_msg += "<option value='" + list_cat[cat][n] + "'>"

Always escape attribute values. Never access the same property twice (DRY).

+ list_cat[cat][n] + "<\/option>";

^^^
The one good thing about this script (which does not help it to win any good
award, though) is that the ETAGO delimiter (`</') is always escaped (in the
most efficient way possible) so that the code can be copied easily into an
HTML document without causing a markup syntax error.

show_msg += "<\/select>";
}

if (document.getElementById)
document.getElementById('subcategory').innerHTML = show_msg;

Avoid innerHTML (especially avoid mixing standards-compliant methods like
getElementById with the proprietary innerHTML), use standards-compliant DOM
properties and methods, only complemented with proprietary approaches if the
latter are better compatible.

else if (document.all)
document.all[subcategory].innerHTML = show_msg;

^^^^^^^^^^^^
Really, Internet Explorer 4 (which does not support CSS floats)?

else if (document.layers) {

^^^^^^^^^^^^^^^

Really, Netscape 4 (which does not support CSS floats)?

document.layers[subcategory].document.write(show_msg);

In theory, there should be

document.layers[subcategory].document.open();

before, further optimized to

var doc = document.layers[subcategory].document;
doc.open();

aso. But you probably want to get rid of this altogether.

document.layers[subcategory].document.close();
}
}


// The HTML part of the SELECT menu
<select name="category" size="1" onChange="getSubcat(this.value)">

Avoid *unconditional* `onchange' for `select' elements; that is _not_ user-
friendly.

// The HTML part of the checkboxes; roughly 40 of these
// are actually shown
// "option" is intended as a variable here,

IIUC: Don't, this is proprietary.

// so the live page doesn't actually say "option"

And *what* *does* it say?

<div style="float:left">
<input type="checkbox" name="more" id="option" value="option">

What do you need the ID for? And should the value not be, say, "1"?

Option

Use `label' elements so that `Option' triggers the related checkbox.
Use the `accesskey' attribute if possible.

</div>

PointedEars

Not with javascript. Nonsense propagates like wildfire in this field.
-- Richard Cornford, comp.lang.javascript, 2011-11-14