Javascript changes selection on Reload




DOM: Core & HTML
15 years ago
9 years ago


(Reporter: Jerome Lacoste, Unassigned)


(Blocks: 1 bug)


Firefox Tracking Flags

(Not tracked)




(1 attachment, 1 obsolete attachment)

34.11 KB, text/html


15 years ago
Note: It might be a Mozilla bug or a web developer bug. 

The problem happens at the aforementionned URL where you are supposed to book a
flight for RyanAir.
Select London Stansted on the 1st drop down list and whatever you want on the
second one, submit the form and then come back. You will see that the page is
initially displayed correctly and then something, probably javascript, modifies
the selection of the second drop-down. From now on, if you do next/back many
times (without submitting) you will see a different element being selected. 

Happens with mozilla 1.5 (Gecko/20030925), doesn't with Opera 6.03. Tested on
GNU/Linux. Reproduced by Kowaslky from #mozillazine on mozilla 1.5rc2, firebird
and Netscape 7.1.

Opera 6.03 on Linux and IE 6.0 SP1 with all patches on windows do not reproduce
the problem.

Disabling javscript fixes the problem.

So it is either a mozilla javascript bug, or there is malfunctionning javascript
in the page, tailored to Gecko. I will try to investigate the javascript issue
to see if it is coming from us.

Comment 1

15 years ago
Some more info.
When I meant disable javascript, I mean disable it after you've made your
drop-down selections (as javascript is involved for these selections to work).

I also noticed that if I select the first entry in the second drop-down,
currently Aarhus when you have selected London Stanfeld in the first one, the
bug is not reproduced. Kowalski on #mozillazine found the same thing.

I looked at the javascript in the page and there's nothing that makes me thing
that this code is problematic. I think it is a strange mozilla bug.

Comment 2

15 years ago
Reloading the page changes (increments?) the index of the 2nd selection box, if
it doesn´t point to the first destination.

You don´t need to submit, just select a Origin, and a destination.
It doesn´t change for the first entry of the all destination list, AARHUS,
but that entry isn´t served for every origin, as there are shorter destiantion
lists for most of the origins.

Selecting the 2nd on the list, the list position got incremented with each reload,
But seen starting from Frankfurt, it doesn´t increment, but changes wildly, but
reproducable. Also changing with higher destinations from Stanstead.

It is not changing, when you set the Origin box back to Origin.

Browsersniffing seems to be fine, and Mozilla gets the IE_stylesheet, as
provided explicitely for mozilla.


Excerpts from the file:
The list changing function gets called twice,
in body onload, and that seems to be working, as you shortly see the original
destination after reload, then to be replaced by another one.
This may be done by the onchange call in the 1st input box.

I´m not a js programmer, so I don´t see more than described here.
Hope I´ll learn how to use venkman on bugs like this one.

<body bgcolor=#ffffff onLoad="changeOrigDestList(document.SBform.sector1_o, 
document.SBform.sector1_d, 'Destination', true, 1, '', '' ); 
change_sector_2_fields( '', true );

Origin box:
<select name='sector1_o' size=1
document.SBform.sector1_d, 'Destination', false, 1)" class='large' width=175>

Destination box:			
<select name='sector1_d' size=1  class='large' width=175>
			<option value='XXX' selected>Destination
Summary: Javscript changes selection → Javascript changes selection on Reload

Comment 3

15 years ago
Created attachment 133090 [details]
Reduced testcase #1

Comment 4

15 years ago
Created attachment 133091 [details]
Reduced testcase #2

Reduced testcase #1 has a typo; use testcase #2 instead
Attachment #133090 - Attachment is obsolete: true

Comment 5

15 years ago
The key function is:

function changeOrigDestList(origBox, destBox, labelDest, fromOnload,  
                            whichSector, labelOpenJaw, preferredDest)
475 {
476     if (!document.images)
477     {
478         return;
479     }
481     var origIndex    = eval(origBox.selectedIndex)
482     var destIndex    = eval(destBox.selectedIndex)
483     var orig         = origBox.options[ origIndex ].value
484     var dest         = destBox.options[ destIndex ].value
485     var initDest    = 0
488     if (orig != "XXX")
489     {
490         orig = eval(orig)
491         destBox.length = 1
492         var newDest = new Option(labelDest)
493         destBox.options[0] = newDest
494         destBox.options[0].value = "XXX"
496         for (var i = 0; i < orig.length-1; i++)
497         {
498             destBox.length += 1
499             destBox.options[destBox.length - 1] = new Option( 
                                eval('s' + orig[i]) + " (" + orig[i] + ")" )
501             destBox.options[destBox.length - 1].value = orig[i]
503             if ( dest == destBox.options[destBox.length - 1].value )
504             {
505                 initDest = destBox.length - 1
506             }
507         }
510         if (fromOnload == true)
511         {
512             origBox.selectedIndex = origIndex
513             destBox.selectedIndex = destIndex
514         }
515         else
516         {
517             destBox.selectedIndex = initDest
518         }
520     }
521     else
522     {
523         refillDestList( destBox, labelDest, labelOpenJaw);
524     }
527 }

Comment 6

15 years ago
The function is being called from two places:

1. From the onLoad handler of the body element:

<body onLoad="changeOrigDestList(document.SBform.sector1_o,   
                                'Destination', true, 1, '', '' )">

2. From the onChange handler of the first drop-down:

<select name='sector1_o' onChange="changeOrigDestList(document.SBform.sector1_o, 
                                                      'Destination', false, 1)">

The two drop-down lists are named "sector1_o", "sector1_d", respectively.
In the function, these two lists are passed in as |origBox| and |destBox|. 
Notice the function stores the selectedIndex of |destBox| on this line:

482     var destIndex    = eval(destBox.selectedIndex)

Then notice |destBox| is recreated from scratch. For example, if we
have selected "London Stansted" in |origBox|, the funtions loops through
a linked list |aSTN| defined earlier in the file as a 69-element array:

           ["AAR", "AHO", "AOC", "AOI", etc. etc. ]

Then the |selectedIndex|of |destBox| is set back to its original value on 
this line, if we fall into the (fromOnload == true) branch of the function:

513          destBox.selectedIndex = destIndex

or here, otherwise:

517          destBox.selectedIndex = initDest

Note that |initDest| has a rather more complicated definition above.
This is what happens if (fromOnload == false), i.e. the function is
being called from the onChange handler of the first drop-down ...

Comment 7

15 years ago
It is clear there is nothing here involving JavaScript Engine.
Reassigning to DOM Level 0 for further triage. 

I don't know enough about the interplay between the <body> onLoad
handler and the <select> onChange handler to comment further -
Component: JavaScript Engine → DOM Level 0

Comment 8

15 years ago
setting default owner, QA -
Assignee: rogerl → dom_bugs
QA Contact: PhilSchwartau → ashshbhatt

Comment 9

15 years ago
IE6 seems to behave well on the reduced testcase, although I do get
different results depending on whether I access the testcase from the
Bugzilla server or as a saved local file:

Bugzilla server: IE6 reloads both drop-downs to their initial default values
     Local file: IE6 preserves the chosen values in both drop-downs upon reload

I am using "Reload" in each case (not Shift+Reload), yet IE6 seems to
show this difference in behaviors. Each behavior is acceptable, however,
and there is no sign of the jumping around that Mozilla is doing.
Assignee: general → nobody
QA Contact: ashshbhatt → general
You need to log in before you can comment on or make changes to this bug.