Filament•13mo ago

Submit button inside section in livewire component

Hi everybody, I created a livewire component with a form inside. Everything is running smoothly, but I’m not able to put the the submit button inside the section (and possibly centered). In the picture what I would like to achieve. Here the code: Here the form() inside the livewire component

  public function form(Form $form): Form
  {
    return $form
      ->schema([
        Forms\Components\Group::make()
          ->schema([
            Forms\Components\Section::make($this->entity->name)
              ->schema([
                Repeater::make('exhibitionWines')
                  ->label("Vini per evento")
                  ->relationship()
                  ->simple(
                    Forms\Components\Select::make('wine_id')
                      ->relationship('wine', 'name')
                      // ->options(Wine::where('winery_id', '=', auth()->user()->winery->id)->get()->pluck('name', 'id'))
                      ->native(false)
                      ->preload(),
                  )->addActionLabel('Aggiungi Vino all\'evento'),
              ])->compact()
          ])->columnSpan(2),
      ])
      ->columns(4)
      ->model($this->entity)
      ->statePath('entityData');
  }

And here the blade file:

<div>
  <form wire:submit="create">
    {{ $this->form }}
    <x-filament::button type="submit">
      SALVA I VINI
    </x-filament::button>
  </form>
  <x-filament-actions::modals />
</div>

Solution:

Put this code below Repeater, and remove button from blade file ```php Forms\Components\Placeholder::make('salvaTest') ->hiddenLabel() ->content(new HtmlString(...

Jump to solution

3 Replies

Solution

Vp•13mo ago

Put this code below Repeater, and remove button from blade file

Forms\Components\Placeholder::make('salvaTest')
    ->hiddenLabel()
    ->content(new HtmlString(
        Blade::render('
            <x-filament::button type="submit">
              SALVA I VINI
            </x-filament::button>
        '))
    )
    ->extraAttributes(['class' => 'flex justify-center']),

Forms\Components\Placeholder::make('salvaTest')
    ->hiddenLabel()
    ->content(new HtmlString(
        Blade::render('
            <x-filament::button type="submit">
              SALVA I VINI
            </x-filament::button>
        '))
    )
    ->extraAttributes(['class' => 'flex justify-center']),

ziolupoOP•13mo ago

Thank you Vp! It's working like a charm. Here below the complete code if needed by other people! Thanks again, didn't now about Blade:render ! .

  public function form(Form $form): Form
  {
    return $form
      ->schema([
        Forms\Components\Group::make()
          ->schema([
            Forms\Components\Section::make($this->entity->name)
              ->schema([
                Repeater::make('exhibitionWines')
                  ->label("Vini per evento")
                  ->relationship()
                  ->simple(
                    Forms\Components\Select::make('wine_id')
                      ->relationship('wine', 'name')
                      // ->options(Wine::where('winery_id', '=', auth()->user()->winery->id)->get()->pluck('name', 'id'))
                      ->native(false)
                      ->preload(),
                  )->addActionLabel('Aggiungi Vino all\'evento'),
                  Forms\Components\Placeholder::make('savePersonal')
                  ->label('')
                  ->content(new HtmlString(
                      Blade::render('
                          <x-filament::button type="submit">
                            SALVA I VINI
                          </x-filament::button>
                      '))
                  )
                  ->extraAttributes(['class' => 'flex justify-center']),
              ])->compact(),
          ])->columnSpan(2),
      ])
      ->columns(4)
      ->model($this->entity)
      ->statePath('entityData');
  }

  public function form(Form $form): Form
  {
    return $form
      ->schema([
        Forms\Components\Group::make()
          ->schema([
            Forms\Components\Section::make($this->entity->name)
              ->schema([
                Repeater::make('exhibitionWines')
                  ->label("Vini per evento")
                  ->relationship()
                  ->simple(
                    Forms\Components\Select::make('wine_id')
                      ->relationship('wine', 'name')
                      // ->options(Wine::where('winery_id', '=', auth()->user()->winery->id)->get()->pluck('name', 'id'))
                      ->native(false)
                      ->preload(),
                  )->addActionLabel('Aggiungi Vino all\'evento'),
                  Forms\Components\Placeholder::make('savePersonal')
                  ->label('')
                  ->content(new HtmlString(
                      Blade::render('
                          <x-filament::button type="submit">
                            SALVA I VINI
                          </x-filament::button>
                      '))
                  )
                  ->extraAttributes(['class' => 'flex justify-center']),
              ])->compact(),
          ])->columnSpan(2),
      ])
      ->columns(4)
      ->model($this->entity)
      ->statePath('entityData');
  }

Vp•13mo ago

Welcome, can you format your code using three (3) backticks ```

Gaming

Programming

Submit button inside section in livewire component