How to add onchange event on an Input

[0xcrypto]

I am not much familiar with orchid so I am using Orchid Crud to implement a basic crud form for a model having only id, name, slug and timestamp columns. For the slug column, I want to generate it using javascript from the value of name field when user types in some text. You can see, this is a pretty simple need of adding an onchange event on an input box in a screen. But I couldn't find anything to accomplish this in the documentation. Can someone help me on this?

[macit-emre]

i am searching for a while too.

[juliardi]

It can be achieved using Listener. Though it is not as flexible as using JS, it does the trick for me. This is from Orchid's Listener documentation page :

The Listener layout is a special type of layout that is used to update the displayed data on a screen in response to user input. This is useful when you want to create dynamic and interactive screens that can change their appearance and behavior based on user actions.

[0xcrypto]

Too late for that but thanks. I hope it helps others.

[macit-emre]

extend std input field like;

namespace App\Orchid\Fields;

class CustomInput extends \Orchid\Screen\Fields\Input
{
    public function __construct(){
        $this->inlineAttributes[] = 'onclick';
        $this->inlineAttributes[] = 'onchange';//onblur, onfocus, etc..
        parent::__construct();
    }
}

Then set it where you use,

$input->onchange("console.log('onchange works') ");

[0xcrypto]

Too late for that but thanks. I hope it helps others.