Question

I want to fire click event when selecting elements from drop down list items. each click event should be diiferent depend on the value of element in drop down.

 <select id="cmbMoreFunction" name="cmbMoreFunction" multiple="multiple">
            <option value="0">ATM Event Status</option>
            <option value="1">Statistics</option>
 </select>

If I Click on “ATM Event Status” Only its specific click event should get fired.

I tried this ..but doesnt work

 $('#cmbMoreFunction select option').click(function() 
 { 
    //Depend on Value i.e. 0 or 1 respective function gets called. 
 });

Basically I just dont want another BUTTON on my page for catch all the value and then fire event.

Answer 1

Use the change handler on the select, read it’s value, and decide what to do then:

$('#cmbMoreFunction').change(function() 
{ 
    var selectedValue = parseInt(jQuery(this).val());

    //Depend on Value i.e. 0 or 1 respective function gets called. 
    switch(selectedValue){
        case 0:
            handlerFunctionA();
            break;
        case 1:
            handlerFunctionB();
            break;
        //etc... 
        default:
            alert("catch default");
            break;
    }
});

function handlerFunctionA(){
    alert("do some stuff");    
}

function handlerFunctionB(){
    alert("Do some other stuff");
}

​

Here is a working fiddle example