Lost input focus when triggering the Listener

[julio-parada]

I created a listener following the tutorial: https://orchid.software/en/docs/listener/

I have 6 fields which I use to calculate two values.

When I fill in any of the 6 fields that are in the "$targets" when exiting (TAB key) it does the calculation but loses focus and does not go to the next field. Then you have to use the mouse to click on the next field.
Is this the normal behavior? There is a workarround for this issue?

Orchid Version = '9.19.7'

Thanks.
JP

[kubre]

There is tabindex(int $value) method on fields. You can use it like this

// In PaymentScreen
Select::make('payment_mode')
      ->tabindex(4)
      ->options(Receipt::PAYMENT_MODES)
      ->title('Payment Mode')
      ->required(),

// Inside ModeListener
Input::make('bank_branch')
      ->title('Bank Branch')
      ->tabindex(5),
  Input::make('transaction_no')
      ->title('Transaction No')
      ->tabindex(6),
// ... and so on

Pressing tab will focus on next number, so in listener put 'number + 1' from your last field in screen and you can continue back in screen class with 'number + 1' from listener. It's no necessary to be in 'number + 1' as the next number just need to be larger than previous one like z-index.

[julio-parada]

Hi Kubre,

I tried the suggestion above and the problem persists. Every time I filled or change the content of any field in the screenshot and press the TAB key, the focus is lost, and none of fields are focused. They calculate the new value, update screen with the new value and lost the focus.

Any new sugestions?

JP

[julio-parada]

Hi Kubre,

I discovered what I´m doing wrong. I´ve put all input and calculated fields on the Listener. The Listener sends back the calculated values, and send HTML from input fields toguether, and so, loses the focus.
I moved the input fields to Edit Screen and create two Listeners for each calculated field. Now this is working OK, but I´ve to mix several layouts to assembly the form.

Thanks,

JP

[gladiiss]

HI,
I am facing same issue. Can you please show your code or elaborate your answer
Gladis

[julio-parada]

Hi Gladiiss,
I had two fields to calculated and I created just one Listener. I also wanted to output a sequence of fields without breaks between them. If I remember correctly, I had all input fields inside the Listener.
To solve the problem, I had to create one Listener for each calculated field on screen (Valor Comissão Corretor and Valor Saldo Financiado), and remove the input fields from the listener put them on EditScreen.
In the EditScreen, on layout() I mixed the two group of fields with the two Listeners:

          $tabs['Valores'] = [
                Layout::rows($this->detailsCUB()),   
                Layout::rows($this->fieldsCommission()),  // Group 1
                ReservaUnidadeComissaoListener::class,    // Listener to calc comission (Comissão)
                Layout::rows($this->fieldsEntry()),       // Group 2
                ReservaUnidadeSaldoListener::class,       // Listener to calc balance (Saldo)
            ];

I hope this can help you,
Regards,
JP

[gladiiss]

Thank you very much for your explanation.
It really helped