dillingham / nova-items-field by dillingham

Nova field to handle array columns
854,501
113
1
Package Data
Maintainer Username: dillingham
Package Create Date: 2019-01-10
Package Last Update: 2022-05-04
Home Page:
Language: Vue
License: MIT
Last Refreshed: 2024-11-23 03:20:31
Package Statistics
Total Downloads: 854,501
Monthly Downloads: 7,012
Daily Downloads: 219
Total Stars: 113
Total Watchers: 1
Total Forks: 32
Total Open Issues: 12

Nova Items Field

Latest Version on Github Total Downloads Twitter Follow

Laravel Nova array items field with sorting, validation & many display options

nova-array-input-field

Installation

composer require dillingham/nova-items-field

Usage

use NovaItemsField\Items;
function fields() {
    return [
        Items::make('Emails'),
    ]
}

and be sure to cast the property as an array on your eloquent model

public $casts = [
    'emails' => 'array'
];

Validation

Use Laravel's built in array validation

Items::make('Emails')->rules([
    'emails.*' => 'email|min:10',
]),

Manually setting the attribute may be needed in some cases.

Items::make('Long Text', 'attribute')->rules([
    'attribute.*' => 'email|min:10',
]),

Array processing

Use the array to perform other actions by making an observer

function saving($user)
{
    foreach($user->emails as $email)
    {
        //
    }
}

Replace item vue component

Here's a brief walkthrough to customize the vue item - view

Additional options

| function | description | default | | - | - | - | | ->max(number) | limit number of items allowed | false | | ->draggable() | turn on drag/drop sorting | false | | ->fullWidth() | increase the width of field area | false | | ->maxHeight(pixel) | limit the height of the list | false | | ->listFirst()| move add new to the bottom | false | | ->inputType(text) | text, date, etc | "text" | | ->placeholder($value) | the new item input text | "Add a new item" | | ->deleteButtonValue($value) | value for delete button | "x" | | ->createButtonValue($value) | value for create button | "Add" | | ->hideCreateButton() | hide the "add" button | false |