selecting dropdown values using arrow keys on keyboard
<p>I have an autosuggest component where I want to select the values using the up and down arrow keys, as well as using the mouse. Here's the code:</p>

<pre><code>$(document).ready(function() {
$('.dropdown').hide();
$('.autosuggest').keyup(function (e) {
// we also have to check if user is deleting entries
// in that case less than 3 characters also trigger suggestion
isDelete = false;
// if delete or backspace were pressed,
// less than 3 characters also trigger suggestion
if( e.which == 8 || e.which == 46) {
isDelete = true;;
}
var search_term = $(this).attr('value');
// if search term does not exist or
// if it is less than 3 chars and user hasn't deleted any chars
// then hide the list
if(
search_term.length == 0 ||
(search_term.length &lt; 1 &amp;&amp; isDelete == false)
) {
$('.dropdown').hide();
} else {
$('.dropdown').show();
}


// check if we have at least 1 characters or user is deleting characters
if(search_term.length &gt;= 1 || isDelete == true) {
// read the values of the select elements (drop downs)
// read the value of category
var category=$('#category').attr('value');
// this is the conditions you will post over to the searchApp.php script
// assembled here for clarity
var conditions = {
'search_term' : search_term,
'category' : category
};
// alert(conditions.toSource());
// post the conditions over to the searchApp.php script
$.post('ajax/searchApp.php', conditions, function(data) {
//alert(data);
$('.result').html(data);

// you can sort this out yourself
$('.result li').click(function() {
var result_value=$(this).text(); 
$('.autosuggest').attr('value',result_value);
//alert(result_value);
$('.result').html('');
});

});
};
});
});
$(document).keydown(function(e){
    if (e.keyCode == 38) {
    moveSelection("up");
    //alert( "up pressed" );
    return false;
    }else if (e.keyCode == 40) {
    moveSelection("down");
    //alert( "down pressed" );
    return false;
    }
    });
(document).ready(function() {
       $('.dropdown').hide();
            $('.autosuggest').keyup(function (e) {
                isDelete = false;
                     if( e.which == 8 || e.which == 46) {
                               isDelete = true;;
                                       }
              var search_term = $(this).attr('value');
            if(search_term.length == 0 || (search_term.length &lt; 1 &amp;&amp;
                                    isDelete     == false)
                                              ) {
                         $('.dropdown').hide();
                                         } else {
                                            $('.dropdown').show();
                                             }


                         if(search_term.length &gt;= 1 || isDelete == true) {
                            var category=$('#category').attr('value');
                                var conditions = {
                                      'search_term' : search_term,
                                         'category' : category
                                                                 };

                  $.post('ajax/searchApp.php', conditions, function(data) {

                       $('.result').html(data);

                            $('.result li').click(function() {
                               var result_value=$(this).text(); 
                                $('.autosuggest').attr('value',result_value);
                                                $('.result').html('');
                                                                      });

                                                                });
                                                             };
                                                         });
                                                 });
                                         $(document).keydown(function(e){
                                                if (e.keyCode == 38) {
                                                    moveSelection("up");

                                                      return false;
                                                     }else if (e.keyCode == 40) {
                                                      moveSelection("down");
                                                       return false;
                                                          }
                                                       });
</code></pre>

<p>Section that doesn't work:</p>

<pre>


    $(document).keydown(function(e){
                if (e.keyCode == 38) {
              moveSelection("up");
            return false;
               }else if (e.keyCode == 40) {
                 moveSelection("down");
                  return false;
                         }
                    });

</pre>
