Question

hitting my head against the wall.. google searched and checked previous q’s here.. cant find the answer.. using jquery 1.9.1

pretty simple problem… select drop down list, want my func to fire when the drop down list is changed by the user.. problem is . nothing happens.. no errors.. func wont fire

$("select.radStatus").change(function() {
    // alert('Value change to ' + $(this).attr('value'));
    $.ajax({
       type: "GET",
       url: "ajax_me.php",
       data: "officeLocName=" + $(this).val(),
       success: function(msg){
           $('#signInResult').html('<img src="img/checkmark.png" />');
        }
    });
});

HTML is:

<select id="radStatus" name="officeLocName">
<option value="1">choice 1</option>
<option value="2">choice 2</option>
<option value="3">choice 3</option>
</select>

i try to sewlect a new option… event doesnt fire… nothing happens.. no errors in firebug

thanks

Update:
thank you it works!

Answer 1

this is not the select when you are within $.ajax and ID prefix needs to be used in selector

There is no point making another DOM search as other answers suggest, just declare the select val as variable before the $.ajax

$("select#radStatus").change(function() {
    var value=$(this).val();
    $.ajax({
       type: "GET",
       url: "ajax_me.php",
       data: "officeLocName=" + value,
       success: function(msg){
           $('#signInResult').html('<img src="img/checkmark.png" />');
        }
    });
});