JavaScript - onchange event not working in Select box which is inside div tag

Asked By bhanu d on 06-Nov-09 12:51 AM

This is the code

<div id="citydiv"><select name="txtEID" id="txtEID" onChange="alert('hhh')" >
        <option value="Select">Select</option>
        
        </select></div>

combo box onChange

mv ark replied to bhanu d on 06-Nov-09 12:59 AM
The code looks & works fine for me. It will work only when you select an option from the combo box
        <div id="citydiv"><select name="txtEID" id="txtEID" onChange="alert('hhh')" >
        <option value="Select">Select</option>
         <option value="India">India</option>
                  <option value="US">US</option>
        </select></div>

Using Ajax

bhanu d replied to mv ark on 06-Nov-09 01:13 AM

Forgotten to mention. Using AJAX i am populating the dropdown box.. 


Multiple Options

F Cali replied to bhanu d on 06-Nov-09 01:15 AM

Since you only have one option in your drop down, the onchange event will not be triggered.  Try adding other option values and change the value of your drop down and your onchange event will be triggered.

Regards,
http://www.sql-server-helper.com/sql-server-2008/index.aspx

onchange event
Chaitra R replied to bhanu d on 06-Nov-09 01:32 AM

Hi Bhanu since you are populating the select box in your code using ajax.. you need to attach the onchange event to each item after it is populated in your ajax code itself.As shown in the below code

yourDropDownName.setAttribute("onchange",function(){yourFunctionName()});

Using Ajax
mv ark replied to bhanu d on 06-Nov-09 01:56 AM
It's possible that an error in populating the dropdown is preventing the alert fired by onchange event from showing up.

If you are using IE 8, invoke Error console to view errors & warnings by hitting F12 (for Developer Tools), CTRL + 3 (to jump to the Script tab which is third in the tab list) and then CTRL + ALT + I to go to the Console window.

If you are using Firefox, review & take action on any errors pointed out by the Error Console option from the Tools menu or by using the keyboard shortcut Ctrl+Shift+J.
try this
Jack jack replied to bhanu d on 10-Nov-09 05:14 AM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">

<HTML>

<HEAD>

<script language="javascript" >

function ShowAlert()

{

alert('change event of Select Box.')

}

</script>

<TITLE>Test</TITLE>

</HEAD>

<BODY >

<div id="dvTest"><select name="SelTest" id="SelTest" onChange="ShowAlert()" >

<option value="Select">Select</option>

<option value="one">one</option>

<option value="two">two</option>

</select></div>

</BODY>

</HTML>