F
Filament•6mo ago
tinkypinky

Repeater with Fileupload doesn't update previews on using $set

Hi all. I am using a Filament repeater with 3 field. 2 Textinputs and 1 Fileupload. I am using another fileupload to fetch multiple images then make a repeater field based on number of images so that description can be added to each of the image. When I use $set to dynamically update my repeater, the data is there but no preview is shown by file upload it just shows original UI to select a file. Is there a better way to do this?
6 Replies
awcodes
awcodes•6mo ago
Can you share your set function?
tinkypinky
tinkypinky•6mo ago
Forms\Components\FileUpload::make('temp_images')->multiple()->image()->dehydrated(false),
                Forms\Components\Actions::make([
                    Action::make('copy_images')->action(function ($get, $set) {
                        $rep_data = [];
                        $images = $get('temp_images');
                        foreach ($images as $key => $image) {
                            $rep_data[] = [
                                'photo_type' => '',
                                'photo_description' => '',
                                'photo_url' => [$key => $image]
                            ];
                        }
                        $set('temp_images',[]);
                        $set('images',$rep_data);
                    })
                ]),
                Repeater::make('images')
                    ->statePath('images')
                    ->addActionLabel('Add Photo')
                    ->reorderable()
                    ->columns(3)
                    ->columnSpanFull()
                    ->schema([
                        Select::make('photo_type')->label('Photo Type')
                            ->options(['Exterior' => 'Exterior', 'Interior' => 'Interior', 'Roof' => 'Roof', 'Neighborhood' => 'Neighborhood', 'Routine Maintenance' => 'Routine Maintenance', 'Deferred Maintenance' => 'Deferred Maintenance', 'Life Safety' => 'Life Safety']),
                        Textarea::make('photo_description')->label('Photo Description'),
                        Forms\Components\FileUpload::make('photo_url')->label('Photo')->deletable(false)
                    ])
Forms\Components\FileUpload::make('temp_images')->multiple()->image()->dehydrated(false),
                Forms\Components\Actions::make([
                    Action::make('copy_images')->action(function ($get, $set) {
                        $rep_data = [];
                        $images = $get('temp_images');
                        foreach ($images as $key => $image) {
                            $rep_data[] = [
                                'photo_type' => '',
                                'photo_description' => '',
                                'photo_url' => [$key => $image]
                            ];
                        }
                        $set('temp_images',[]);
                        $set('images',$rep_data);
                    })
                ]),
                Repeater::make('images')
                    ->statePath('images')
                    ->addActionLabel('Add Photo')
                    ->reorderable()
                    ->columns(3)
                    ->columnSpanFull()
                    ->schema([
                        Select::make('photo_type')->label('Photo Type')
                            ->options(['Exterior' => 'Exterior', 'Interior' => 'Interior', 'Roof' => 'Roof', 'Neighborhood' => 'Neighborhood', 'Routine Maintenance' => 'Routine Maintenance', 'Deferred Maintenance' => 'Deferred Maintenance', 'Life Safety' => 'Life Safety']),
                        Textarea::make('photo_description')->label('Photo Description'),
                        Forms\Components\FileUpload::make('photo_url')->label('Photo')->deletable(false)
                    ])
The data is getting copied properly and even saved on clicking create button and loaded when edit page opens after saving model with preview correctly. Only issue is not showing after using $set to end-user.
awcodes
awcodes•6mo ago
Images needs to be an array of arrays Looks like you might be doing that though. What if you remove statePath from the images repeater? That’ll be the default from the make(). Maybe it’s creating a path of images.images Something feels off about this to me though since the image paths are temp URLs until the form is saved.
tinkypinky
tinkypinky•6mo ago
These $images is an array of $key and TemporaryUploadFile Instances Should I save files before copying to other field? The Path is correct as other fields and even this one are getting copied properly. Only issue is previewing. They are not just URLs, they are instances of TemporaryFileUpload
awcodes
awcodes•6mo ago
I know. But that is still a path. It’s just path to livewire-tmp instead of the final destination path on save. I’m wondering if the uuid is getting changed using set resulting in an invalid mapping to the temporary file. Is there a reason to go through this trouble vs just uploading an image to each repeater item, since the items don’t necessarily always have the same number of items? I’m also not seeing a ->live() on any of the fields so the the repeater will never get updated “in real time”
tinkypinky
tinkypinky•6mo ago
Actually the user wants to upload say 20 files at the same time but then after uploading needs to enter the other two fields for each of the image. Is there an alternate way to do this? If I save files in action and then send them to repeater, previews are loading correctly But the issue is, in this case the user may navigate away without saving model and files will be there. How to handle this?
Want results from more Discord servers?
Add your server
More Posts
Skip Import when model is existingHello is it possible to skip a row during import when model is already existing?Model observer doesn't works on relation managerI have a created observer function on a model but on Relation Manager inside resource, it doesn't fiExport action on custom pageIs it possible to add a an export action to a custom page. My use case is that I want a page with cdynamic Use $class;I am working on making a plugin / module / whatever you want to call it... I am curious to know if Must <foreign_model>_id be fillable to save it on resource creation?I have two models, Opportunity -> belongsTo -> Company. The `opportunities` table has a `company_id`Error on the hidden method on Action (Typed property ...Component::$container)Hello, I am having some issues with an action that i have places inside a form: ```PHP Section::makSelect with relationship and custom labelI am using a select component, but I am facing an issue when I try to customize the query to only shrender a filament table using blade`Hello, how can you create a table in a blade template. We pass some data into a blade template andError when installing filament from forked repoError: ``` Script Illuminate\Foundation\ComposerScripts::postAutoloadDump handling the post-autoloadPlaceholder on relational table columns```php Tables\Columns\TextColumn::make('quoteRequest.phone_number') ->label(__('Phone number'))