Question

I am going to have a list of select fields, collecting the same type of data. For example, I’ll have a few select lists, tagged to the same class.

<select name="NBSCourse1" class="NBSCourse"></select>
<select name="NBSCourse2" class="NBSCourse"></select>
<select name="NBSCourse3" class="NBSCourse"></select>
// and so on... 

I’ve written a method to detect change in the select lists, all referring to them by class.

$("select.NBSCourse").change(function() {
 //Other codes here

})

It seems that the first select list (name=”NBSCourse1″) works, but the other select lists do not work. Am I not supposed to use classes for select lists, if there are multiple similar ones?

---

Details on what I’m trying to do…

Actually, the first row of Select Fields has been initialized by a jQuery function I’ve wrote: addrow(n). The method is called during, on $(document).ready.

I also have a button “Add More”, which will call the addrow(n) function. I’ve declared a counter that’s called ‘counterNBSCourse’, which I passed into the function. addrow(counterNBSCourse).

function addRow(n){         
var tablerow 
tablerow = "<tr>";
tablerow += "<td><select name='NBSCourse" + n + "' class='NBSCourse'></select></td>";
    //Other select fields

   tablerow += "</tr>"


    $("table.courses").append(tablerow);

//Method to populate select list
    $.ajax({url:"dropdown.asp?type=courseidfill", success:function(result) { 
     $("select[name=NBSCourse" + n + "]").html(result);

}})

        counterNBSCourse++

    }

As you can see, when I add another row of select fields that has a class “NBSCourse”, my is name according to the current value of “counterNBSCourse”. “NBSCourse1″,”NBSCourse2”.. etc.

At the moment, only responds to the field.

Further notes of the $(“select.NBSCourse”).change(function() {

$("select.NBSCourse").change(function () {

    //Getting select field's name       
var name
name = $(this).attr('name');

    //Getting the number tagged behind the select name file     
var num     
num = name.replace("NBSCourse","");

//Getting selected value
    var nbsCourseid;
nbsCourseid = $(this).val();

//Function to populate another select field,        
$.ajax({url:"dropdown.asp?value="+ nbsCourseid + "&type=courseid",success:function(result) { 

 $("select[name=IndexNo" + num + "]").html(result);                 
}})     
})

Answer 1

It’s ok to use class selector, you miss a " of your code $("select.NBSCourse).