Multiple Forms in a Resource Page
Is it posible to have two forms in a Resource???
i have the next resource page where i followed the documentation like that:
3 Replies
class RecordFileResource extends Resource implements HasForms {
use InteractsWithForms;
---
public static function getForms(): array
{
return [
'editProfileForm',
'editPasswordForm',
];
}
public static function editProfileForm(Form $form): Form
{
return $form
->schema([
Section::make('Profile Information')
->description('Update your account\'s profile information and email address.')
->schema([
TextInput::make('name')
->required(),
TextInput::make('email')
->email()
->required()
->unique(ignoreRecord: true),
]),
]);
}
public static function editPasswordForm(Form $form): Form
{
return $form
->schema([
Section::make('Update Password')
->description('Ensure your account is using long, random password to stay secure.')
->schema([
TextInput::make('Current password')
->password()
->required()
->currentPassword(),
TextInput::make('password')
->password()
->required()
->autocomplete('new-password')
->live(debounce: 500)
->same('passwordConfirmation'),
]),
]);
}
class RecordFileResource extends Resource implements HasForms {
use InteractsWithForms;
---
public static function getForms(): array
{
return [
'editProfileForm',
'editPasswordForm',
];
}
public static function editProfileForm(Form $form): Form
{
return $form
->schema([
Section::make('Profile Information')
->description('Update your account\'s profile information and email address.')
->schema([
TextInput::make('name')
->required(),
TextInput::make('email')
->email()
->required()
->unique(ignoreRecord: true),
]),
]);
}
public static function editPasswordForm(Form $form): Form
{
return $form
->schema([
Section::make('Update Password')
->description('Ensure your account is using long, random password to stay secure.')
->schema([
TextInput::make('Current password')
->password()
->required()
->currentPassword(),
TextInput::make('password')
->password()
->required()
->autocomplete('new-password')
->live(debounce: 500)
->same('passwordConfirmation'),
]),
]);
}
<x-filament-panels::page>
<div
class=""
x-data="{ tab: 'tab1' }">
<x-filament::tabs label="Content tabs">
<x-filament::tabs.item @click="tab = 'tab1'" :alpine-active="'tab === \'tab1\''">
Tab 1
</x-filament::tabs.item>
<x-filament::tabs.item @click="tab = 'tab2'" :alpine-active="'tab === \'tab2\''">
Tab 2
</x-filament::tabs.item>
</x-filament::tabs>
<div class="fi-fo-tabs-tab outline-none fi-active p-6">
<div class="grid grid-cols-[--cols-default] fi-fo-component-ctn gap-6" x-show="tab === 'tab1'">
content 1
<form wire:submit.prevent="submit">
{{ $this->editProfileForm ||
<div class="d-flex mt-3 justify-content-end">
<button type="submit"/>
</div>
</form>
</div>
<div x-show="tab === 'tab2'">
<!-- here should be the other form -->
</div>
</div>
</div>
</x-filament-panels::page>
<x-filament-panels::page>
<div
class=""
x-data="{ tab: 'tab1' }">
<x-filament::tabs label="Content tabs">
<x-filament::tabs.item @click="tab = 'tab1'" :alpine-active="'tab === \'tab1\''">
Tab 1
</x-filament::tabs.item>
<x-filament::tabs.item @click="tab = 'tab2'" :alpine-active="'tab === \'tab2\''">
Tab 2
</x-filament::tabs.item>
</x-filament::tabs>
<div class="fi-fo-tabs-tab outline-none fi-active p-6">
<div class="grid grid-cols-[--cols-default] fi-fo-component-ctn gap-6" x-show="tab === 'tab1'">
content 1
<form wire:submit.prevent="submit">
{{ $this->editProfileForm ||
<div class="d-flex mt-3 justify-content-end">
<button type="submit"/>
</div>
</form>
</div>
<div x-show="tab === 'tab2'">
<!-- here should be the other form -->
</div>
</div>
</div>
</x-filament-panels::page>
A resource is not a livewire component. So this won’t work on the resource class. I think you’re trying to use livewire functionality on a non livewire component. In filament panels the EditRecord, CreateRecord, ListRecords pages are the actual livewire components. The resource is just a glue between them all.
ahhhh thanks so much!