CODEWITHSUNDEEP
javascriptjquery
Shaggy
Shaggy

Reputation: 5790

Click event on Dropdown items - jquery

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.

Upvotes: 7

Views: 69285

Answers (4)

Priya-Systematix
Priya-Systematix

Reputation: 119

You can also use javascript. eg.

$document.ready(function(){
$('#cmbMoreFunction').change(function(){

var dataValue=document.getElementById('cmbMoreFunction').value;
if(dataValue==0){call functionFirst();}
else{call functionSecond();}
});
});

Upvotes: 0

Umair Noor
Umair Noor

Reputation: 442

check this JsFiddle

Simple use this code JQuery:

$('#cmbMoreFunction').click(function(v){
  console.log(v.target.value);
  });

Hopefully your problem will solved.

Upvotes: 5

Asciiom
Asciiom

Reputation: 9975

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

Upvotes: 18

sushil bharwani
sushil bharwani

Reputation: 30187

A option element will not have a click event. Click event is associated with Select element only so you will have to apply it to select dropdown. In the function that fires on click event of select dropdown, you can then check individual options and apply your logic.

Upvotes: 2

Related Questions