Select Auto-Complete

An auto-completing Laravel Nova search field.

Provides a capability of auto-completed searching for results inside a select input field.

Installation

You can install the package in to a Laravel app that uses Nova via composer:

composer require techouse/select-auto-complete

Usage

The API is extends Nova's default Select Field by adding these additional options:

default - OPTIONAL - Set the default value in case of an empty field. Default is null.
maxResults - OPTIONAL - Number of results to show at a time. Has to be a positive integer. Default is 30.
maxHeight - OPTIONAL - Height of select dropdown list. Default is 220px.
displayUsingLabels - OPTIONAL - List only the labels of the options list. Default is disabled and displays keys and labels.
placeholder - OPTIONAL - Use a custom placeholder.

Simply use SelectAutoComplete class instead of Select directly or alias it like the example below so you won't have to refactor too much existing code.

<?php

namespace App\Nova\Actions;

use App\AccountData;
use Illuminate\Bus\Queueable;
use Laravel\Nova\Actions\Action;
use Illuminate\Support\Collection;
use Laravel\Nova\Fields\ActionFields;
use Illuminate\Queue\SerializesModels;
use Illuminate\Queue\InteractsWithQueue;
use Illuminate\Contracts\Queue\ShouldQueue;
use Techouse\SelectAutoComplete\SelectAutoComplete as Select;

class EmailAccountProfile extends Action
{
    use InteractsWithQueue, Queueable, SerializesModels;

    /**
     * Perform the action on the given models.
     *
     * @param  \Laravel\Nova\Fields\ActionFields  $fields
     * @param  \Illuminate\Support\Collection  $models
     * @return mixed
     */
    public function handle(ActionFields $fields, Collection $models)
    {
        foreach ($models as $model) {
            (new AccountData($model))->send();
        }
    }

    /**
     * Get the fields available on the action.
     *
     * @return array
     */
    public function fields()
    {
        return [
            Select::make(__('Person'), 'person')
                  ->options(\App\Person::all()->mapWithKeys(function ($person) {
                      return [$person->id => $person->name];
                  }))
                  ->displayUsingLabels(),
                  
            Select::make(__('Partner'), 'partner')
                  ->options(\App\User::all()->pluck('name', 'id'))
                  ->placeholder('Pick a name') // use a custom placeholder
                  ->displayUsingLabels()       // display only the labels od the options list
                  ->default(7)                 // set the default to the User with the ID 7
                  ->maxResults(5)              // limit the dropdown select to a max of 5 hits
                  ->maxHeight('100px')         // limit the dropdown to a max height of 100px
                  ->required()                 // make the field required
        ];
    }
}