F
Filament17mo ago
Emaz

Layout question - Grids and Columns on a Form

Hi folks! Glad to see this isn't a ghost town due to Laracon! lol Layout Question - I have a fieldset that's 5 columns wide. Based on previous selections, those 5-columns will show anywhere between 1 and 5 drop downs. That's working. The use case is that on a Form the user selects a 1-5 bedroom count. Based on that, the bed types fieldset shows a drop down for each bedroom where bed type is selected (King, queen etc). But each bedroom can have two beds, bedA and BedB. If the user has selected 2 bedrooms, my code will populate 4 of the 5 columns with dropdowns so it's laid out like this: Bed Types Bed1a, Bed2a, Bed2a, Bed2b But I wish I could make it a 2x2 grid within the fieldset instead, like this: Bed Types Bed1a Bed2a Bed2b Bed2b I guess I don't understand the Grid function. I'm used to setting a column count but I'm uncertain how to use Grid. Can I do this with a Grid?? Any help would be appreciated. Hope this question makes sense.
Solution:
Like this
Fieldset::make('Bed Types')->schema([Grid::make(5)->schema([]), Grid::make(5)->schema([])])
Fieldset::make('Bed Types')->schema([Grid::make(5)->schema([]), Grid::make(5)->schema([])])
Jump to solution
15 Replies
Patrick Boivin
Patrick Boivin17mo ago
Hi @emaz_, I think this should do what you need:
Grid::make(2)->schema([
TextInput::make('oneA'),
TextInput::make('oneB'),
TextInput::make('twoA'),
TextInput::make('twoB'),
]),

// Laid out as:
// oneA oneB
// twoA twoB
Grid::make(2)->schema([
TextInput::make('oneA'),
TextInput::make('oneB'),
TextInput::make('twoA'),
TextInput::make('twoB'),
]),

// Laid out as:
// oneA oneB
// twoA twoB
Or did I miss a detail in the ordering you are trying to create?
Emaz
EmazOP17mo ago
Thanks! But looks like I can't have a grid within a Fieldset? Undefined property: App\Forms\Components\SectionFieldset::$Grid
Emaz
EmazOP17mo ago
Sorry... how do I do codeblocks here in Discord?
Emaz
EmazOP17mo ago
See, a prior dropdown hides unnecessary selects. But if I have less than 5 bedrooms it will just fill columns...
Emaz
EmazOP17mo ago
Iliyas M
Iliyas M17mo ago
So u need 2 columns per row right?
Emaz
EmazOP17mo ago
No, 5. There are 5 but I hide the 'unused' bedrooms. So I really want 5 columns, 2 rows. All within one fieldset 1a 2a 3a 4a 5a 1b 2b 3b 4b 5b The problem is, if I hide 4a and 5a because there are only 3 bedrooms, they fill the top row
Iliyas M
Iliyas M17mo ago
You can add 2 grid layouts each for a series and b series.
Emaz
EmazOP17mo ago
I couldn't even add one for a fieldset... it says... Undefined property: App\Forms\Components\SectionFieldset::$Grid
Iliyas M
Iliyas M17mo ago
Within fieldset's schema array, you can add multiple grid layouts.
Emaz
EmazOP17mo ago
Oh, gotta put it in the schema... I see. I'll try that, thanks
Solution
Iliyas M
Iliyas M17mo ago
Like this
Fieldset::make('Bed Types')->schema([Grid::make(5)->schema([]), Grid::make(5)->schema([])])
Fieldset::make('Bed Types')->schema([Grid::make(5)->schema([]), Grid::make(5)->schema([])])
Emaz
EmazOP17mo ago
Great, thanks! I'll give it a shot
Emaz
EmazOP17mo ago
Perfect, thanks! I have some pretty deep schema to do this but it worked beautifully. I'll post some screen shots.
Emaz
EmazOP17mo ago
I select number of bedrooms, hide some columns, and my 'a' row and 'b' row remain as separate rows due to the grid. Thanks so much.
Want results from more Discord servers?
Add your server