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

casperbaske's avatar

Fill Livewire form with external data

Hello. I need to prefill a regular Filament form with external data (from Google Books and a few other resources) but it looks like Livewire gets all confused when I do it with vanilla JS. For example, I get "field is required" when there's text with a dash, even when I edit the field manually.

Is there anything I'm missing?

Thanks in advance.

0 likes
6 replies
MohamedTammam's avatar

How are you filling it using JavaScript? show some code.

If you want to fill data from API you can do so.

For inputs:

Select::make('status')
    ->options(getDataFromApi());

For tables:

public function table(Table $table): Table
{
    $apiCall = Http::asJson()
        ->acceptJson()
        ->get(config('app.url') . '/api/subscription');
 
    return $table
        // You might think this works, but it does not.
        // It's not meant for this use-case
        ->viewData($apiCall->json('data'))
        ->columns([
            TextColumn::make('user_name'),
            TextColumn::make('name'),
            TextColumn::make('price'),
            TextColumn::make('start_date'),
            TextColumn::make('end_date'),
        ]);
}

https://laraveldaily.com/post/filament-load-table-data-from-3rd-party-api

If you're using JavaScript in front-end you need to trigger $wire.set for it to reflect in Livewire.

1 like
casperbaske's avatar

@MohamedTammam Thank you for the response.

It's a search field that will fetch data from the some APIs and I'm setting the values of the form fields by using "foo = document.getElementById('data.foo'); foo.value = bar". I'm aware that it's far from the right way to do it, but I'm over the deadline of the project and the code was already there.

casperbaske's avatar

@MohamedTammam That's a Blade file that has a x-dynamic-component markup, not the component's definition itself. AFAIK I can't access $wire there.

I solved by dispatching the input event in all the updated fields and it's working. Next week I'll extend the component and do it the right way.

But thanks anyway.

Please or to participate in this conversation.