Question

I have a question with jQuery. Can one not pass the id’s to a javascript function containing jQuery with certain events?

For example, load_dll works perfectly. I’m struggling to get update_dll to work properly.

 //Create values for drop down list
var empType = ['Sales Associate', 'New Hire Sales Associate', 'Post-Hire Graduation', 'Senior Supervisor'];
//initialize values
load_ddl(empType, 'empTypeddl');
update_dll('empTypedll', 'empType');
//Populate drop down list function
function load_ddl(arr, id) {
    for (i = 0; i < arr.length; i++) {
        $('<option/>').val(arr[i]).html(arr[i]).appendTo('#' + id);
    }
}
//Update Function
function update_ddl(source_id, target_id) {
    $('#' + source_id).change(function() {
        alert($('#' + source_id + ' option:selected').attr('value'));
    });
}

If I simplify it down to it’s most basic form it works though. Is it possible to pass the id’s?

$('#empTypeddl').change(function() {
     alert($('#empTypeddl option:selected').attr('value'));
});

Answer 1

Try passing in the source_id as even data like so:

//Update Function
function update_ddl(source_id, target_id) {
    $('#' + source_id).change({source_id: source_id}, function(event) {
        alert($('#' + event.data.source_id + ' option:selected').attr('value'));
    });
}

This creates a data property and appends it to the event object.