onchange not fired when select an option with mouse in mozilla

[snkreddy]

when i select an option from drop down with mouse, the selected value was not reflecting and onchange was not called.

this.myActivityButtonGui = slider.document.createElement("select");
      
      // this.myActivityButtonGui.options[this.myActivityButtonGui.options.length] = new Option("S", "C", false, false);
      // this.myActivityButtonGui.options[this.myActivityButtonGui.options.length] = new Option("M", "M", false, false);
      // this.myActivityButtonGui.options[this.myActivityButtonGui.options.length] = new Option("L", "R", false, false);
      // this.myActivityButtonGui.options[this.myActivityButtonGui.options.length] = new Option("G", "G", false, false);
      // this.myActivityButtonGui.options[this.myActivityButtonGui.options.length] = new Option("F", "F", false, false);
       
    var opt1 = document.createElement("option");
	var opt2 = document.createElement("option"); 
	var opt3 = document.createElement("option"); 
	var opt4 = document.createElement("option");
	var opt5 = document.createElement("option"); 
	
	
	opt1.value = "C";  
	opt1.text = "S";  
	opt1.id= "C";
	
	opt2.value = "M"; 
	opt2.text = "M";
	opt2.id= "M";

	opt3.value = "R"; 
	opt3.text = "L";
	opt3.id = "R";

	opt4.value = "G"; 
	opt4.text = "G";
	opt4.id = "G";

	opt5.value = "F"; 
	opt5.text = "F";
	opt5.id= "F";
		
	if(browserType.indexOf("MSIE")!= -1){
		this.myActivityButtonGui.add(opt1);
		this.myActivityButtonGui.add(opt2);
		this.myActivityButtonGui.add(opt3);
		this.myActivityButtonGui.add(opt4);
		this.myActivityButtonGui.add(opt5);
	}else{
		this.myActivityButtonGui.add(opt1,null);
		this.myActivityButtonGui.add(opt2,null);
		this.myActivityButtonGui.add(opt3,null);
		this.myActivityButtonGui.add(opt4,null);
		this.myActivityButtonGui.add(opt5,null);
		
	}

	this.myActivityButtonGui.onchange= function(){ // when i use //mouse with mozilla it is not coming into the loop that is onchange was //not fired.
	slElement.value = this.options[this.selectedIndex].value;
}
this. myActivityButtonGui.className = "myActivityButton";
   	 this. myActivityButtonGui.id = "MyActivityButton" + nextLinePos;
	slider.element.appendChild(this. myActivityButtonGui);
	this. myActivityButtonGui.title = slider.sliderGrid.shiftActivityText;
	/* */
	
	this.stElement = stElement;
	this.etElement = etElement;
	this.brElement = brElement;
	this.slElement = slElement;

[jscheuer1]

That's not really enough code to go on. If I substitute workable objects/strings for all of the undefined parts leading up to and including the insertion of the select element to the page, it works in Firefox 10 here. That is the onchange event fires, only to error out on:

Error: slElement is not defined
Line: 61

Which in my mock up is this line:

	slElement.value = this.options[this.selectedIndex].value;

. . . part of the onchange event.

So, unless it's also undefined in the full code, that's no help.

If you want more help, please post a link to the page on your site that contains the problematic code so we can check it out.

[snkreddy]

Please find the code links below.

http://pastebin.com/BBvgqv9H
http://pastebin.com/ixS0AGQz
http://pastebin.com/HMH0JiW9

[jscheuer1]

I might need all that code later, probably not.

For now I do need a link to the page itself.

[snkreddy]

John, It was not posted in public domain.It was an intranet application.

[jscheuer1]

There's one thing you can try, where you have:

	this.myActivityButtonGui.onchange= function(){ // when i use //mouse with mozilla it is not coming into the loop that is onchange was //not fired.
alert('here');
	slElement.value = this.options[this.selectedIndex].value;
}

add the highlighted alert. That will at least tell is if the event is firing or not. We need to know if it's that, or possibly the next line that's the problem.

But even with that, we still have no real answer. And that's simply too much code to go through figuring out what each thing is supposed to do and/or substituting proxy values where needed. Even if I did that, it might still work, as the real test is to see it in action. Put up a live demo of the problem or create an archive that has all of the resource files needed to run it and see the problem in action and either attach it to a message here or if it's too big for that, give me a link to the archive.

If it's too private for that, we can make arrangements for you to get it to me privately.

[snkreddy]

Hi John,

Sorry for not explaining the problem properly.

This code works fine in IE8 with mouse, that is when i select an option from drop down the value in the box changes and selected value is visible.
If click on save button, onchange is fired and value is saved to DB.

But in mozilla if i select(click) on one of the drop down option, the value in the box still showing the default one. when i click on save,onchange was not fired because the drop down box value is still showing default one.

But when i put the cursor on any option and press enter from keyboard, the text box is showing the selected value, and when i click on save it is saving to db.

so the mouse left click on the drop down options is not working with mozilla.