window.event.returnValue = false in firefox

[Ja NE]

(I'm not a programer, I have learned enough php to build my cms, but
that doesn't make me coding guru, so please excuse me if I'm asking
something trivail...)

well, I have one upload form where I want my users to choose category
for their picture. they are alowed to upload more then one picture at
time. and there is a problem. I have to use
<select name="name[$num]">
for my php script, so I have added id to the select tag
<select id="katSelector$num" name="name[$num"]>
so I can test if there is the same number of choosen category as the
number od pictures chossen for upload:
(whole php/javascript function

function validateCat()
{
<?
$uvjeti = "";
for ($num=0; $num<$brsl; $num++) {
$element = "$uvjeti(document.iduslike.katSelector$num.value == 0)";
if ($num < ($brsl - 1)) {
$uvjeti = "$element || ";
}
else {
$uvjeti = "$element";
}
}
echo"if ($uvjeti) {\n alert( \"just alert message\" );\n
window.event.returnValue = false;\n t}";
?>
}

in a case of 2 photos to upload, above functions create following code
in my page:

<script type="text/javascript">
<!--
function validateCat()
{
if ((document.iduslike.katSelector0.value == 0) ||
(document.iduslike.katSelector1.value == 0)) {
alert( "just alert message" );
window.event.returnValue = false;
}
}
//-->
</script>

and that works in Safari on my Mac, that works in IE on friends PC, but
that doesn't work on Firefox on any platform: I'm getting alert mesage,
but my upload function gets executed.

I have found that FF (and NN) doesn't understud:
window.event.returnValue = false;

It is now second day as I'm trying to find solution, but my knowlage of
js (and other variations) is so limited that I just can't go anmy
further...

please, can anyone help me?


here is whole form for case with just one photo to upload:
(trimed some irelevant lines)
(as seen in browser!)

<form name="iduslike" enctype="multipart/form-data" action=""
method="POST">
<input type="hidden" name="MAX_FILE_SIZE" value="153600">
<input name="userfile[0]" type="file">
<input type="text" name="slika_naziv[0]" size="20">
<select id="katSelector0" name="slika_kategorija[0]">
<option value="0">IZABERI KATEGORIJU!</option>
<option value="1">kategorija 1</option>
<option value="2">kategorija 2</option>
<option value="3">kategorija 3</option>
</select>
<input type="submit" value="upload" onClick="validateCat()">
<input type="reset">
</form>

 

[Christopher Benson-Manica]

function validateCat()
{
if ((document.iduslike.katSelector0.value == 0) ||
(document.iduslike.katSelector1.value == 0)) {
alert( "just alert message" ); try {
window.event.returnValue = false;

} catch( dummy ) {}
return false; // Tell non-IE to ignore event

}
}

I don't claim that's the most elegant solution, but it's effective.

 

[Michael Winter]

I have to use
<select name="name[$num]">
for my php script, so I have added id to the select tag
<select id="katSelector$num" name="name[$num"]>

There's no need to introduce an id attribute. Just use square bracket
notation:

formObject.elements['name[' + num + ']']

The value of the variable, num, can either be constant (zero to match
'name[0]'), or varied in a loop.

[snip]

<script type="text/javascript">
<!--

Omit the SGML comment. It's unnecessary.

function validateCat()
{
if ((document.iduslike.katSelector0.value == 0) ||
(document.iduslike.katSelector1.value == 0)) {
alert( "just alert message" );
window.event.returnValue = false;
}
}

Expanding on my suggestion above, it would be better to generate code
that resembles:

function validateCat(form) {
for(var i = 0; i < XX; ++i) {
var category = form.elements['name[' + i + ']'];

if('0' == category.options[category.selectedIndex].value) {
alert('...');
return false;
}
}
return true;
}

where XX is the number of SELECT elements, and seems to be $brsl in your
PHP code.

There are a few changes in that code, but two are more significant than
the others.

1. The validateCat function has an argument, form. This is a
reference to the form being validated. This value can either
be supplied from the onsubmit handler:

<form ... onsubmit="return validateCat(this);">

or an onclick handler on a submit button, but the former is
better, in my opinion.
2. Rather than assigning a value to the returnValue property of
an event object, the cod above will simply return that
value.

Your code will fail in Fx and others for two reasons. The
first is that most browsers do not have a global event
object, so window.event will evaluate to undefined.
Secondly, the returnValue property is a proprietary feature.
In other browsers returning a value from an event listener
is equivalent, and is supported by IE, too.

Hope that helps,
Mike

 

[Thomas 'PointedEars' Lahn]

} catch( dummy ) {}
return false; // Tell non-IE to ignore event

So IE is not IE ...

I don't claim that's the most elegant solution, but it's effective.

Effective to break where Exception handling is not supported? Yes.
Effective to submit the form anyway? Yes.


PointedEars

 

[Christopher Benson-Manica]

Effective to break where Exception handling is not supported? Yes.

What UA with any currency doesn't support exception handling?

Effective to submit the form anyway? Yes.

How so?

 

[Christopher Benson-Manica]

I do not know what you mean by "with any currency", so I ignore that.

Basically my point is that yes, if one wants to support absolutely
every conceivable system, one must take extreme care. However, if one
decides that supporting the infinitesimal number of users still
saddled with abysmal UA's like IE 4 and NS 4 isn't worth the extra
effort, cleaner solutions can be devised. Again, I did not claim that
the code I posted was a good idea.

Furthermore, it turns out that there are different levels of support
for exception handling:

<URL:http://pointedears.de/scripts/js-version-info#try>

That resource looks to be full of useful information. However, as
long as we're debating points of pedantry, the "toggle scroll" button
has no effect in Opera, and for whatever reason the table is unusable
in the default button state in IE 6.

However, Michael has already pointed out that there is a
viable solution here without the need for exception handling
where the latter should always be the last resort.

I will keep that in mind.

It should be <form ... onsubmit="return validateCat(this)"> instead
which is always reliable (client-side JS/ECMAScript support provided)
and requires no further language feature.

I noticed that only somewhat later. You're right.

 

[Thomas 'PointedEars' Lahn]

Basically my point is that yes, if one wants to support absolutely
every conceivable system, one must take extreme care. However, if
one decides that supporting the infinitesimal number of users
still saddled with abysmal UA's like IE 4 and NS 4

It is impossible to call that number, but it is certainly not infinitesimal
small.

isn't worth the extra effort,

That person would probably not provide anything important, in both meanings.

cleaner solutions can be devised. Again, I did not claim that the code
I posted was a good idea.

ACK

What about

| It has also been mentioned here that there are mobile devices that do not
| support all ECMAScript 3 features of which exception handling is one.

?

That resource looks to be full of useful information.

Thanks, however I am still working on it. Any constructive information
regarding it is appreciated.

However, as long as we're debating points of pedantry,

I do not consider that to be one:

the "toggle scroll" button has no effect in Opera, and for whatever
reason the table is unusable in the default button state in IE 6.

That is strange as previous tests have shown that overflow:scroll
is supported by IE 6 (could you provide navigator.userAgent of the
browser you have tested with?). I will have to test that code again.


PointedEars

 

[Christopher Benson-Manica]

What about

| It has also been mentioned here that there are mobile devices that do not
| support all ECMAScript 3 features of which exception handling is one.

I've stopped digging

That is strange as previous tests have shown that overflow:scroll
is supported by IE 6 (could you provide navigator.userAgent of the
browser you have tested with?). I will have to test that code again.

Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0)

I also thought IE 6 recognized overflow: scroll, and I'm pretty sure
I've used it before myself. I'm not sure what might be the problem,
but in case it helps I've taken a high-resolution screenshot with my
IE version information and put it at http://ataru.gomen.org/files/ss.jpg.

 

[Thomas 'PointedEars' Lahn]

Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0)

I also thought IE 6 recognized overflow: scroll, and I'm pretty sure
I've used it before myself. I'm not sure what might be the problem,
but in case it helps I've taken a high-resolution screenshot with my
IE version information and put it at http://ataru.gomen.org/files/ss.jpg.

Thanks, that will help.


Regards,
PointedEars