Select options depending of previous select ?

[BorisDemay]

Hello, is it possible to change select options depending of another select ?

I would like the answer select to display only the related answers of the selected question

[tabuna]

A recent example, where a select change the option of another. As an illustrative example, this should work.

1. Create a new screen with the following content:

<?php

namespace App\Orchid\Screens;

use App\Orchid\Layouts\BookSelector;
use Orchid\Screen\Screen;
use Illuminate\Support\Collection;

class BookScreen extends Screen
{
    /**
     * Query data.
     *
     * @return array
     */
    public function query(): iterable
    {
        return [];
    }

    /**
     * Display header name.
     *
     * @return string|null
     */
    public function name(): ?string
    {
        return 'BookScreen';
    }

    /**
     * Button commands.
     *
     * @return \Orchid\Screen\Action[]
     */
    public function commandBar(): iterable
    {
        return [];
    }

    /**
     * Views.
     *
     * @return \Orchid\Screen\Layout[]|string[]
     */
    public function layout(): iterable
    {
        return [
            BookSelector::class
        ];
    }

    /**
     * @param int|null $book
     * @param int|null $chapters
     *
     * @return array
     */
    public function selectBooks(string $book = null)
    {
        return [
            'book'            => $book,
            'optionsChapters' => self::bookSource()->get($book, []),
        ];
    }


    /**
     * @return \Illuminate\Support\Collection
     */
    public static function bookSource(): Collection
    {
        return collect()
            ->put('Moby-Dick', ['Captain Ahab', 'Ishmael', 'Ashore'])
            ->put('Debt: The First 5000 Years', ['On The Experience of Moral Confusion', 'The Myth of Barter']);
    }
}

2. Create a new listener with the following content:

<?php

namespace App\Orchid\Layouts;

use App\Orchid\Screens\BookScreen;
use Orchid\Screen\Fields\Select;
use Orchid\Screen\Layouts\Listener;
use Orchid\Support\Facades\Layout;

class BookSelector extends Listener
{
    /**
     * List of field names for which values will be listened.
     *
     * @var string[]
     */
    protected $targets = [
        'book',
    ];

    /**
     * What screen method should be called
     * as a source for an asynchronous request.
     *
     * The name of the method must
     * begin with the prefix "async"
     *
     * @var string
     */
    protected $asyncMethod = 'selectBooks';

    /**
     * @return Layout[]
     */
    protected function layouts(): iterable
    {
        return [
            Layout::rows([
                Select::make('book')
                    ->options(BookScreen::bookSource()->mapWithKeys(function ($item, $key) {
                        return [$key => $key];
                    }))
                    ->empty('Select a book')
                    ->title('Select Book')
                    ->required(),

                Select::make('chapters')
                    ->title('Select Chapter')
                    ->options($this->query->get('optionsChapters', []))
                    ->disabled(empty($this->query->get('optionsChapters')))
                    ->hidden()
                    ->required(),
            ])
        ];
    }
}

[BorisDemay]

Hello, thanks for your answer, i cannot try it right now, I will try it asap and hit you back.