Jexcel - jquery custom Autocomplete

Jexcel - jquery custom multiple autocomplete

by Spreadsheet Online

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://bossanova.uk/components/jexcel/dist/js/jquery.jexcel.js"></script>
<link rel="stylesheet" href="https://bossanova.uk/components/jexcel/dist/css/jquery.jexcel.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id='my'></div>

JavaScript

var availableTags = [
  "ActionScript",
  "AppleScript",
  "Asp",
  "BASIC",
  "C",
  "C++",
  "Clojure",
  "COBOL",
  "ColdFusion",
  "Erlang",
  "Fortran",
  "Groovy",
  "Haskell",
  "Java",
  "JavaScript",
  "Lisp",
  "Perl",
  "PHP",
  "Python",
  "Ruby",
  "Scala",
  "Scheme"
];
function split( val ) {
  return val.split( /,\s*/ );
}
function extractLast( term ) {
  return split( term ).pop();
}

var customDropDown1 = {
    // Methods
    closeEditor : function(cell, save) {
        // Get value
        var txt = $(cell).find('.editor').val();

        // Set visual value
        $(cell).html(txt);

        // Close edition
        $(cell).removeClass('edition');

        // Save history
        return txt;
    },
    openEditor : function(cell) {
        // Get current content
        var currentValue = $(cell).text();

        // Create the editor
        var editor = document.createElement('input');
        $(cell).html(editor);
        $(editor).prop('class', 'editor');
        $(editor).val(currentValue);
        $(editor).focus();
        $(editor).on('blur', function() {
            $('#' + $.fn.jexcel.current).jexcel('closeEditor', $(cell), true);
        })
        // Create the instance of the plugin
        $(editor)
          // don't navigate away from the field on tab when selecting an item
          .on( "keydown", function( event ) {
            if ( event.keyCode === $.ui.keyCode.TAB &&
                $( this ).autocomplete( "instance" ).menu.active ) {
              event.preventDefault();
            }
          })
          .autocomplete({
            minLength: 0,
            source: function( request, response ) {
              // delegate back to autocomplete, but extract the last term
              response( $.ui.autocomplete.filter(
                availableTags, extractLast( request.term ) ) );
            },
            focus: function() {
              // prevent value inserted on focus
              return false;
            },
...