Filament•11mo ago

How can I get current active form tab in a EditResource page?

I use the tabs layout for a form https://filamentphp.com/docs/3.x/forms/layout/tabs, I want to get current active tab so I can use it inside the getRedirectUrl method for the EditResource.

Installation - Panel Builder - Filament

2 Replies

Ngannv•11mo ago

I was also struggling and had to use the method below. It seems a bit manual, but hopefully it helps you First: in form:

 Forms\Components\Tabs::make("vhelperTab")
                ->tabs([
                    Forms\Components\Tabs\Tab::make("tab1")
                       ->id('tab1')
                        ->schema(......),
                    Forms\Components\Tabs\Tab::make("tab2")
                        ->id('tab2')
                        ->schema(......),
                ])->activeTab($this->providerTabSelected)
                ->id('xxx')
                ->persistTabInQueryString('provider'); //important

 Forms\Components\Tabs::make("vhelperTab")
                ->tabs([
                    Forms\Components\Tabs\Tab::make("tab1")
                       ->id('tab1')
                        ->schema(......),
                    Forms\Components\Tabs\Tab::make("tab2")
                        ->id('tab2')
                        ->schema(......),
                ])->activeTab($this->providerTabSelected)
                ->id('xxx')
                ->persistTabInQueryString('provider'); //important

Then define function :

public function getActiveTabVHelper($url): void
    {
        $queryString = parse_url($url)['query'] ?? null;
        parse_str($queryString??'', $queryParams);
        //auto with number
        $this->providerTabSelected = (int)preg_replace('/[^0-9]/', '', $queryParams['provider']);
        //or switch...
        switch ($queryParams['provider']){
            case 'xxx-tab1-tab':{
                $this->providerTabSelected = 1;
                break;
            }
            case 'xxx-tab2-tab':{
                $this->providerTabSelected = 2;
                break;
            }
        }
    }

public function getActiveTabVHelper($url): void
    {
        $queryString = parse_url($url)['query'] ?? null;
        parse_str($queryString??'', $queryParams);
        //auto with number
        $this->providerTabSelected = (int)preg_replace('/[^0-9]/', '', $queryParams['provider']);
        //or switch...
        switch ($queryParams['provider']){
            case 'xxx-tab1-tab':{
                $this->providerTabSelected = 1;
                break;
            }
            case 'xxx-tab2-tab':{
                $this->providerTabSelected = 2;
                break;
            }
        }
    }

Then: in mount or in submit function call getActiveTabVHelper

   public function mount(): void
    {

        $this->getActiveTabVHelper(request()->fullUrl());
   }

public function onSubmitOrFunctionCallByAjaxLiveWire(){
 $this->getActiveTabVHelper(request()->server('HTTP_REFERER'));
 ....
}

   public function mount(): void
    {

        $this->getActiveTabVHelper(request()->fullUrl());
   }

public function onSubmitOrFunctionCallByAjaxLiveWire(){
 $this->getActiveTabVHelper(request()->server('HTTP_REFERER'));
 ....
}

Document: https://filamentphp.com/docs/3.x/forms/layout/tabs#persisting-the-current-tab-in-the-urls-query-string

Tabs - Form Builder - Filament

SLyOP•11mo ago

Thank you, not exactly same use case, but inspired to use this to get the tab inside redirect url method:

protected function getRedirectUrl(): ?string
    {
        $queryString = parse_url(request()->server('HTTP_REFERER'))['query'] ?? null;
        if ($queryString) {
            parse_str($queryString ?? '', $queryParams);
            $tab = $queryParams['tab'];
        }

        if ($tab == '-services-tab') {
            return $this->getResource()::getUrl('edit', ['record' => $this->record, 'tab' => '-services-tab']);
        }

        return null;
    }

Gaming

Programming

How can I get current active form tab in a EditResource page?