keyboard for searchable method

2 files changed, 7 insertions, 4 deletions

diff --git a/demos.html b/demos.html
index 05a3a33..96af631 100644
--- a/demos.html
+++ b/demos.html
@@ -237,6 +237,7 @@
              </form>
           </div>
           <div class='searchable'  style='display:none'>
+            <input type="text" id="search" autocomplete = "off" />
             <form id='searchable-form' action='http://localhost:4567/ms' method='post'>
                <select name='countries[]' multiple='multiple' id='searchable-select'>
                  <option value='fr' selected='selected'>France</option>
diff --git a/js/application.js b/js/application.js
index c61af77..5fcc5f5 100644
--- a/js/application.js
+++ b/js/application.js
@@ -13,11 +13,13 @@
       }
     });
   
-    $('#searchable-form').multiSelect({
-      selectableHeader : '<input type="text" id="search" autocomplete = "off" />'
-    });
+    $('#searchable-form').multiSelect({});
 
-    $('input#search').quicksearch('#ms-searchable-form .ms-selectable li');
+    $('input#search').quicksearch('#ms-searchable-form .ms-selectable li').on('keydown', function(e){
+      if (e.keyCode == 40){
+        $('#searchable-select').focus();
+      }
+    });
     $('#searchable-form').multiSelect();