Nova Multiselect Field Laravel Package

Getting Started

Minimal Setup

1. Installation:

   composer require outl1ne/nova-multiselect-field
   

   Publish the package assets (if needed):

   php artisan vendor:publish --provider="Outl1ne\MultiselectField\MultiselectFieldServiceProvider"
   

2. First Use Case: Add the field to a Nova resource:

   use Outl1ne\MultiselectField\Multiselect;
   
   public function fields(Request $request)
   {
       return [
           Multiselect::make('Tags')
               ->options(['Option 1', 'Option 2', 'Option 3'])
               ->displayUsing(fn ($value) => $value ?? 'No tags'),
       ];
   }
   

3. Database Consideration: Ensure your model uses a string/text column (e.g., tags) to store JSON-encoded arrays.

Implementation Patterns

Common Workflows

1. Dynamic Options via Closure: Fetch options asynchronously (e.g., from a database):

   Multiselect::make('Categories')
       ->options(function () {
           return Category::query()->pluck('name', 'id');
       })
       ->searchable()
   

2. Dependency Between Fields: Chain multiselects to filter options dynamically:

   Multiselect::make('Subcategories')
       ->options(function () {
           return Subcategory::where('category_id', $this->parent->categories)->pluck('name', 'id');
       })
       ->dependsOn('categories')
   

3. Reordering with Drag & Drop: Enable sorting for a list of items:

   Multiselect::make('Priority Tags')
       ->options(['Urgent', 'High', 'Medium', 'Low'])
       ->sortable()
   

4. Display Formatting: Customize how values appear in detail/index views:

   Multiselect::make('Skills')
       ->options(Skill::all()->pluck('name', 'id'))
       ->displayUsing(fn ($values) => implode(', ', $values ?? []))
   

Integration Tips

• Validation: Use Laravel’s validation rules (e.g., array, required) on the underlying column.
• Search Optimization: For large datasets, cache or paginate the options closure.
• Nova Tool Integration: Combine with Nova’s Action or Tool for bulk operations on multiselect values.

Gotchas and Tips

Pitfalls

1. Database Storage:

   • Values are stored as JSON strings (e.g., ["option1", "option2"]). Ensure your column type (e.g., text) can accommodate this.
   • Fix: Cast the attribute in your model:

     protected $casts = [
         'tags' => 'json',
     ];
     

2. Search Performance:

   • Asynchronous search (->searchable()) may slow down if the options closure is expensive.
   • Tip: Preload data or use caching:

     ->options(function () {
         return Cache::remember('multiselect-options', now()->addHours(1), function () {
             return Category::pluck('name', 'id');
         });
     })
     

3. Dependency Conflicts:

   • If dependsOn fields are not populated, the dependent multiselect may fail silently.
   • Debug: Check Nova’s browser console for errors or use ->default([]) to provide fallback values.

4. Dark Mode Compatibility:

   • The package supports dark mode, but custom CSS may need adjustments.
   • Tip: Inspect the generated HTML/JS in Nova’s dev tools for styling issues.

Debugging

• Console Logs: Enable Nova’s debug mode (config/nova.php) to log field-related errors.
• Network Tab: Verify the asynchronous search requests are returning expected data.
• Database Dumps: Check if stored JSON is malformed:

  dd(json_decode($model->tags, true));
  

Extension Points

1. Custom Templates: Override the field’s Blade template by publishing and modifying:

   php artisan vendor:publish --tag=nova-multiselect-field-views
   

2. Event Hooks: Listen for field-specific events (e.g., multiselect.saving) via Nova’s events.

3. Localization: Extend translations by publishing the language files:

   php artisan vendor:publish --tag=nova-multiselect-field-lang