Saving data from a subform on a custom page

[DasPocky]

Implementing Subforms in Filament Custom Pages

Hi,

I'm thrilled to share with you a solution I've developed for storing data from a subform in its respective relationship on a custom page.

The Journey Begins

It all started with my desire to use the Filament-Profile plugin by ryangjchandler. However, I wanted to do more than just store standard information like Name, Email, and Password. I envisioned storing additional data from a linked table. In my case, it was about the relationship between a User and a Driver. This structure allowed me to keep the information separate, acknowledging the fact that not all users are drivers.

The Challenge

I had already managed to pre-fill data from the respective tables. But the ambition didn't stop there. My next goal was to empower users not only to modify existing information but also to add new data. Specifically, it was about adding a new Vehicle.

To make the user's journey smoother and to prevent them from having to switch pages, I integrated a form using Filament's default capabilities. However, there was a gap - I found no information on how to retrieve and save the data from this integrated form.

The Solution

In my quest for answers, I stumbled upon a Q&A discussion right here on GitHub. It shed light on how to access the data from the form and process it further. After a few trials, I was finally able to devise a solution, which I am excited to share with you today.

I am a beginner and using try and error to get to my goals, I can't explain exactly how the data is received now, but I know from the Q&A that it is stored in the variable "$data". I share with you the most important code parts and added small comments. It may be that some lines are unimportant for the current tutorial, but to understand the context I have added them.

Add the "mount()" funktion to load the information from the linked tables

    public function mount()
    {
        $this->form->fill([
            'name' => auth()->user()->name,
            'email' => auth()->user()->email,
            /* Extra Informations */
            'truck_id' => auth()->user()->driver->truck_id,
            'trailer_id' => auth()->user()->driver->trailer_id,
            'container_id' => auth()->user()->driver->container_id,
        ]);
    }

Add the submit() funktion to submit the Extra Data Informations

public function submit()
    {
        $this->form->getState();

        $state = array_filter([
            'name' => $this->name,
            'email' => $this->email,
            'password' => $this->new_password ? Hash::make($this->new_password) : null,
            /* Extra Informations */
            'truck_id' => $this->truck_id,
            'trailer_id' => $this->trailer_id,
            'container_id' => $this->container_id,
        ]);
        
        /* A check that is not important here */

        $trailer = Trailer::find($this->trailer_id);
        if ($trailer && $trailer->type === 'Tanker') {
            $state['container_id'] = null;
        }

        $user = auth()->user();
        $user->update($state);
        
        /* Finally stores the data in the respective table */
        $driver = $user->driver;
        $driver->update($state);

        if ($this->new_password) {
            $this->updateSessionPassword($user);
        }

        $this->reset(['current_password', 'new_password', 'new_password_confirmation']);
        $this->notify('success', __('Your profile has been updated.'));
    }

But here comes the interesting part, the subform and its functions

Select::make('truck_id')
->label(__('Truck'))
->placeholder(__('Select a truck'))
/* Here the extra information is fetched from the database */
->options(
    Truck::whereNull('driver_id')
        ->orWhere('id', auth()->user()->driver->truck_id)
        ->get()
        ->mapWithKeys(function ($truck) {
            return [$truck->id => $truck->license_plate];
        })
        ->toArray()
)
/* The important form is now loaded here. */
/* This is no problem if you have already worked with it in a resource. */
->createOptionForm([
    Grid::make()->columns(3)
        ->schema([
            TextInput::make('manufacturer')
                ->label(__('Manufacturer'))
                ->required(),
            TextInput::make('license_plate')
                ->label(__('License Plate'))
                ->required(),
            TextInput::make('max_weight')
                ->label(__('Max. Weight'))
                ->required(),
        ]),
])
/* The difficulty now was to get the data from the form */
/* and save it into the associated table */
->createOptionUsing(function ($data) {

    $data = (object) $data;

    return Truck::create(
        [
            'driver_id' =>  auth()->user()->driver->id,
            'manufacturer' => $data->manufacturer,
            'license_plate' => $data->license_plate,
            'max_weight' => $data->max_weight,
        ]
    );
})
->preload()
->searchable()
->required(),

I hope I can help a par people with it. If someone has improvements, always here with it. As mentioned above, Laravel is my hobby and I swing from one problem to another and manage to find my solution with try and error.

Greetings
Björn