Filament•17mo ago

RichEditor shows up as undefined on View Page but no errors

I might be missing something, but when I create a record with a RichEditor, it shows up as undefined, but the text IS saved in in the database table Current filament version: v3.0.15

24 Replies

MatthewOP•17mo ago

Code:

<?php

namespace App\Filament\App\Resources;

use App\Filament\App\Resources\TestResource\Pages;
use App\Filament\App\Resources\TestResource\RelationManagers;
use App\Models\Test;
use Filament\Forms;
use Filament\Forms\Form;
use Filament\Infolists\Components\ImageEntry;
use Filament\Resources\Resource;
use Filament\Tables;
use Filament\Tables\Table;
use Filament\Infolists\Components\Tabs;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Database\Eloquent\SoftDeletingScope;
use Filament\Infolists\Infolist;
use Illuminate\Support\Facades\Auth;

class TestResource extends Resource
{
    protected static ?string $model = Test::class;

    protected static ?string $navigationIcon = 'heroicon-o-rectangle-stack';

    public static function form(Form $form): Form
    {
        return $form
            ->schema([
                Forms\Components\TextInput::make("name"),
                Forms\Components\FileUpload::make("attachment")
                    ->visibility("public")
                    ->disk("public"),
                Forms\Components\RichEditor::make("richtext")
            ]);
    }

    public static function table(Table $table): Table
    {
        return $table
            ->columns([
                Tables\Columns\TextColumn::make("name")
            ])
            ->filters([
                //
            ])
            ->actions([
                Tables\Actions\ViewAction::make(),
                Tables\Actions\EditAction::make(),
            ])
            ->bulkActions([
                Tables\Actions\BulkActionGroup::make([
                    Tables\Actions\DeleteBulkAction::make(),
                ]),
            ])
            ->emptyStateActions([
                Tables\Actions\CreateAction::make(),
            ]);
    }

<?php

namespace App\Filament\App\Resources;

use App\Filament\App\Resources\TestResource\Pages;
use App\Filament\App\Resources\TestResource\RelationManagers;
use App\Models\Test;
use Filament\Forms;
use Filament\Forms\Form;
use Filament\Infolists\Components\ImageEntry;
use Filament\Resources\Resource;
use Filament\Tables;
use Filament\Tables\Table;
use Filament\Infolists\Components\Tabs;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Database\Eloquent\SoftDeletingScope;
use Filament\Infolists\Infolist;
use Illuminate\Support\Facades\Auth;

class TestResource extends Resource
{
    protected static ?string $model = Test::class;

    protected static ?string $navigationIcon = 'heroicon-o-rectangle-stack';

    public static function form(Form $form): Form
    {
        return $form
            ->schema([
                Forms\Components\TextInput::make("name"),
                Forms\Components\FileUpload::make("attachment")
                    ->visibility("public")
                    ->disk("public"),
                Forms\Components\RichEditor::make("richtext")
            ]);
    }

    public static function table(Table $table): Table
    {
        return $table
            ->columns([
                Tables\Columns\TextColumn::make("name")
            ])
            ->filters([
                //
            ])
            ->actions([
                Tables\Actions\ViewAction::make(),
                Tables\Actions\EditAction::make(),
            ])
            ->bulkActions([
                Tables\Actions\BulkActionGroup::make([
                    Tables\Actions\DeleteBulkAction::make(),
                ]),
            ])
            ->emptyStateActions([
                Tables\Actions\CreateAction::make(),
            ]);
    }

    public static function getRelations(): array
    {
        return [
            //
        ];
    }

    public static function getPages(): array
    {
        return [
            'index' => Pages\ListTests::route('/'),
            'create' => Pages\CreateTest::route('/create'),
            'view' => Pages\ViewTest::route('/{record}'),
            'edit' => Pages\EditTest::route('/{record}/edit'),
        ];
    }
}

    public static function getRelations(): array
    {
        return [
            //
        ];
    }

    public static function getPages(): array
    {
        return [
            'index' => Pages\ListTests::route('/'),
            'create' => Pages\CreateTest::route('/create'),
            'view' => Pages\ViewTest::route('/{record}'),
            'edit' => Pages\EditTest::route('/{record}/edit'),
        ];
    }
}

Dennis Koch•17mo ago

No errors also means no console errors?

awcodes•17mo ago

Yea. I’m think the JS is having issues. That field doesn’t look right.

MatthewOP•17mo ago

Huh. I didnt see it the fist time, but I do now

MatthewOP•17mo ago

MatthewOP•17mo ago

I also cleared all the cache, but nothing changed

Dennis Koch•17mo ago

You ran php artisan filament:upgrade?

MatthewOP•17mo ago

Yep

Dennis Koch•17mo ago

Can you try replicating on a fresh install? If yes: Please submit an issue

MatthewOP•17mo ago

Uhm, ok I will try

awcodes•17mo ago

I’m not seeing your FileUpload either in that screenshot shot. Is that all of the console errors.?

MatthewOP•17mo ago

Yep, everything I made a fresh install and still had the same issue. I created an issue on guthub !

awcodes•17mo ago

does it work if you remove the rich editor? i would think if there was a JS issue in Filament then a lot more people would be asking about it.

MatthewOP•17mo ago

What do you mean exactly? Why remove the RichEditor?

MatthewOP•17mo ago

If I remove the RichEditor, then no errors in console:

awcodes•17mo ago

because all the components have separate js that gets loaded independantly. so, if you remove the Rich Editor from your form and the image editor starts to work, then we know it's something specific to the editor. So, without it the FileUpload is showing an working?

MatthewOP•17mo ago

I dont have the FIleUpload at all in the reproduction repo Just the RichText Even if I have JUST the RichEditor, then I still get undefined

awcodes•17mo ago

I'm talking about the code you provided at the top of this thread

MatthewOP•17mo ago

Well there, if I remove the FIleUpload, it still doesnt work

MatthewOP•17mo ago

awcodes•17mo ago

please do this and tell me if the FileUpload is showing and working:

return $form
->schema([
    Forms\Components\TextInput::make("name"),
    Forms\Components\FileUpload::make("attachment")
        ->visibility("public")
        ->disk("public"),
]);

return $form
->schema([
    Forms\Components\TextInput::make("name"),
    Forms\Components\FileUpload::make("attachment")
        ->visibility("public")
        ->disk("public"),
]);

That's all i'm asking

MatthewOP•17mo ago

FileUpload has always worked fine This works No errors

awcodes•17mo ago

ok. thank you. from your screen shot earlier the gap made it look like the file upload wasn't showing. sorry. that's why i was thinking everything was broken.

MatthewOP•17mo ago

ohh nono no problem, it just a personal photo I used as a test, that why I didnt include it 😅

Gaming

Programming

RichEditor shows up as undefined on View Page but no errors