Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

garrettmassey's avatar

Nova form fields being skipped on TAB key

The Issue:

I have a strange issue where when I am trying to fill out a create or update form for a specific resource in Nova (in my case, a "Document" resource), the order in which I can tab through the inputs is wrong. Some fields are skipped entirely, and others are not in the right order.

The Document resource code:

<?php

namespace App\Modules\Documents\Nova;

use App\Modules\Documents\Models\Document as DocumentModel;
use App\Modules\Documents\Statuses\DocumentStatus;
use App\Modules\Documents\Types\AllowedMimeTypes;
use App\Nova\Traits\NonReplicableResource;
use Auth;
use Eminiarts\Tabs\Traits\HasTabs;
use Illuminate\Http\Request;
use Laravel\Nova\Fields\BelongsTo;
use Laravel\Nova\Fields\File;
use Laravel\Nova\Fields\Hidden;
use Laravel\Nova\Fields\Select;
use Laravel\Nova\Fields\Text;
use Laravel\Nova\Fields\Textarea;
use Ramsey\Uuid\Uuid;
use Spatie\TagsField\Tags;

class Document extends Resource
{
    use NonReplicableResource;
    use HasTabs;

    /**
     * The model the resource corresponds to.
     * as a class string
     *
     * @var string $model
     */
    public static string $model = DocumentModel::class;

    /**
     * The single value that should be used to
     * represent the resource when being displayed.
     *
     * @var string $title
     */
    public static $title = 'name';

    /**
     * The model's property columns
     * that should be searchable on
     * the resource
     *
     * @var string[] $search
     */
    public static $search = [
        'id', 'name', 'type',
    ];

    /**
     * Get the fields displayed by the resource.
     *
     * @param  Request  $request
     * @return array
     */
    public function fields(Request $request): array
    {
        return [
            Text::make('Name')
                ->required()
                ->readonly(false)
                ->size('sm:w-full md:w-1/4'),

            BelongsTo::make(
                name: 'In Folder: ',
                attribute: 'directory',
                resource: Directory::class,
            )->size('sm:w-full md:w-1/4'),

            Select::make(
                name: 'Document Status',
                attribute: 'status'
            )->options([
                DocumentStatus::PUBLIC() => DocumentStatus::PUBLIC(),
            ])->required()
                ->default(DocumentStatus::PUBLIC())
                ->help('All documents will be public by default until document encryption is implemented')
                ->size('sm:w-full md:w-1/4'),

            Tags::make('Tags')
                ->size('sm:w-full md:w-1/4')
                ->type('Document Tags')
                ->limit(3),

            Textarea::make(
                name: 'Description',
                attribute: 'description'
            )->rows(3)
                ->size('sm:w-full md:w-1/2'),

            File::make(
                name: 'Attachment',
                attribute: 'file'
            )->disk('public')
                ->path('/documents')
                ->storeAs(function (Request $request) use ($newUUID) {
                    return $newUUID.'.'.$request->file->getClientOriginalExtension();
                })->acceptedTypes(implode(',', AllowedMimeTypes::getExtensions()))
                ->required()
                ->help('Accepted File Types: .doc, .docx, .pdf, .xls, .xlsx, .ppt, .pptx, .zip, .jpg, .jpeg, .png, .gif, .svg, .mp3, .mp4')
                ->size('sm:w-full md:w-1/2'),

            Hidden::make('Views', 'views')->default(0)->required(),

            Hidden::make('Downloads', 'downloads')->default(0)->required(),

            Hidden::Make('Version', 'version')->default(1)->required(),

            Hidden::make('UUID', 'UUID')->default($newUUID)->required(),

            Hidden::make('Created By', 'created_by')->default(Auth::id())->required(),

            Hidden::make('Updated By', 'updated_by')->default(Auth::id())->required(),
        ];
    }
}

In this resource, when I go to create a new document or edit an existing document, the Select field, the Spatie\TagsFiels\Tags field, the Textarea and File fields are all skipped over entirely. The current order of fields by hitting the "TAB" key are:

  1. Name (Text)
  2. In Folder (BelongsTo)
  3. Main Menu Brand Link (Nova's logo)
  4. Rest of menu/navigation in normal order.
  5. back to 1

What I have tried:

Since I am using a few third party packages to extend Nova's functionality, I have tried removing both the size() method call on the fields, and I have also tried removing the Tags field from Spatie to see if that was interfering. Neither of these approaches resolved the issue.

I have also tried clearing the browser's cache and hard resetting, and I have tried artisan cache:clear. There are no console errors in the browser.

Not sure what is causing these fields to be skipped over, any thoughts?

0 likes
1 reply
garrettmassey's avatar

So the issue seems to be related to the BelongsTo relationship, and if it is being pre-filled by a viaResource parameter. If the BelongsTo field is pre-filled, the only way to get the tab order to work correctly is to "re-select" the already selected BelongsTo option, and then you can tab to the next field.

I'm not sure if this is a bug with Nova or an issue with my code and browser.

Please or to participate in this conversation.