Nuclear Pumpkin Mocha

    spectre-auto-complete

    0.0.1 • Public • Published

    spectre-auto-complete

    Autocomplete library for spectre css framework https://picturepan2.github.io/spectre/

    Instalation:

    Requirement:

    • JQuery 3.x
    • Spectre 0.5.x

    CDN:

    https://cdn.jsdelivr.net/npm/spectre-auto-complete@latest/spectre-auto-complete.min.css
    https://cdn.jsdelivr.net/npm/spectre-auto-complete@latest/spectre-auto-complete.min.js
    

    Example:

    <html>
        <header>
            <!-- spectre -->
            <link rel="stylesheet" href="spectre.min.css">
            <link rel="stylesheet" href="spectre-exp.min.css">
            <link rel="stylesheet" href="spectre-icons.min.css">
     
            <!-- spectre-auto-complete CSS -->
            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/spectre-auto-complete@latest/spectre-auto-complete.min.css">
        </header>
        <body>
            <!-- JQuery -->
            <script src="jquery-3.x.min.js"></script> 
            
            <!-- spectre-auto-complete JS -->
            <script src="https://cdn.jsdelivr.net/npm/spectre-auto-complete@latest/spectre-auto-complete.min.js"></script> 
        </body>
    </html>

    Usage:

    HTML

    <div class="form-group">
      <div class="form-autocomplete">
        <input class="form-input form-autocomplete-input"/>
      </div>
    </div>

    Javascript

    $(".form-autocomplete").autoComplete({
      source: function(inputValue, callback){
        // Do something like fetch data with xhr
        var data= ["apple", "banana", "guava"];
        
        callback(data, null) // If error, you can use callback(null, error); . Error will passed as argument to error handler
      }
    });

    Options arguments:

    options["source"] = options.source || [];
    options["render"] = options.render || defaultRender;
    options["error"] = options.error || console.error;
     
    options["delay"] = options.delay || 0;
    options["minChar"] = options.minChar || 0;
    options["menuClass"] = options.menuClass || "";
    options["menuItemClass"] = options.menuItemClass || "";
     
    options["empty"] = options.empty || "Not Found";
     
    options["cache"] = options.cache || false;
    options["clearCacheInterval"] = options.clearCacheInterval || 1000 * 60 * 10;
     
    options["runOnFocus"] = options.runOnFocus || true;

    Install

    npm i spectre-auto-complete

    DownloadsWeekly Downloads

    1

    Version

    0.0.1

    License

    MIT

    Unpacked Size

    15.2 kB

    Total Files

    6

    Last publish

    Collaborators

    • laodemalfatih