Javascript works fine with a hard-coded string, but not with a variable

I have a problem that I struggled with all morning, so I felt it was time to help! I have a javascript function that receives a value entered by a user in an autocomplete field, uses AJAX to send this value to a php script that queries the database, and then populates the next field with possible parameters. The problem is that all this works fine when I hard code the selected option:

var selected="Ed Clancy";

but not when he pulls it out of the window, like this:

var selected = this.getValue();

I tried debugging this with a warning window, and the same line appears in both blocks, so I'm completely puzzled! Any ideas? Full code below:

$(riderSelected).on('selectionchange', function(event){
    var selected = this.getValue();
    //var selected="Ed Clancy";
    alert(selected);
    $('#nap4').removeAttr('disabled');
    $('#nap4').empty();
    $('#nap4').append($("<option>-select-</option>"));

    $.ajax({ 
type: "GET",
url: 'getbiketype.php',
data: { name: selected },
success:  function(data) {
  console.log(data);
  $('#nap4').append(data);
}
});

});
+4
2

magicsuggest - http://nicolasbize.com/magicsuggest/doc.html, , ,

var selected = this.getValue()[0];

+2

, .

$(riderSelected).on('change', function (event) {
    var selected = this.value;
    alert(selected);
    $('#nap4').removeAttr('disabled');
    $('#nap4').empty();
    $('#nap4').append($("<option>-select-</option>"));

    $.ajax({
        type: "GET",
        url: 'getbiketype.php',
        data: {name: selected},
        success: function (data) {
            console.log(data);
            $('#nap4').append(data);
        }
    });

});
0

All Articles