Can we disable field from JS

Form builder4️⃣v4

Big table repeater with some fields being disabled according to other fields state.
Performance is very degraded.

Example:

Toggle::make(FormFieldKeysEnum::NOTED->value)
  ->live()
  ->afterStateUpdatedJs(
      (function () {
          $inputTypeKey = FormFieldKeysEnum::INPUT_TYPE->value;
          $radioValue = FieldsEnum::RADIO->value;

          return <<<JS
              if (\$state) {
                  \$set('$inputTypeKey', '$radioValue');
              }
          JS;
      })()
  ),

Select::make(FormFieldKeysEnum::INPUT_TYPE->value)
  ->options(FieldsEnum::getOptions())
  ->disabled(fn (Get $get) => $get(FormFieldKeysEnum::NOTED->value))
  ->dehydrated(),

Toggle::make(FormFieldKeysEnum::NOTED->value)
  ->live()
  ->afterStateUpdatedJs(
      (function () {
          $inputTypeKey = FormFieldKeysEnum::INPUT_TYPE->value;
          $radioValue = FieldsEnum::RADIO->value;

          return <<<JS
              if (\$state) {
                  \$set('$inputTypeKey', '$radioValue');
              }
          JS;
      })()
  ),

Select::make(FormFieldKeysEnum::INPUT_TYPE->value)
  ->options(FieldsEnum::getOptions())
  ->disabled(fn (Get $get) => $get(FormFieldKeysEnum::NOTED->value))
  ->dehydrated(),

Here I'm already using JS to set the state, but I would like to disable field as well using JS to avoid full component refresh.

this line cause the toggle to take 2-3 seconds to update, even with

afterStateUpdatedJs

afterStateUpdatedJs

->disabled(fn (Get $get) => $get(FormFieldKeysEnum::NOTED->value))

->disabled(fn (Get $get) => $get(FormFieldKeysEnum::NOTED->value))

NB: this is only a little portion of the fields in repeater.

partial rendering doesn't seem to help here...

Can we disable field from JS

Form builder4️⃣v4

Big table repeater with some fields being disabled according to other fields state.
Performance is very degraded.

Example:

Toggle::make(FormFieldKeysEnum::NOTED->value)
  ->live()
  ->afterStateUpdatedJs(
      (function () {
          $inputTypeKey = FormFieldKeysEnum::INPUT_TYPE->value;
          $radioValue = FieldsEnum::RADIO->value;

          return <<<JS
              if (\$state) {
                  \$set('$inputTypeKey', '$radioValue');
              }
          JS;
      })()
  ),

Select::make(FormFieldKeysEnum::INPUT_TYPE->value)
  ->options(FieldsEnum::getOptions())
  ->disabled(fn (Get $get) => $get(FormFieldKeysEnum::NOTED->value))
  ->dehydrated(),

Toggle::make(FormFieldKeysEnum::NOTED->value)
  ->live()
  ->afterStateUpdatedJs(
      (function () {
          $inputTypeKey = FormFieldKeysEnum::INPUT_TYPE->value;
          $radioValue = FieldsEnum::RADIO->value;

          return <<<JS
              if (\$state) {
                  \$set('$inputTypeKey', '$radioValue');
              }
          JS;
      })()
  ),

Select::make(FormFieldKeysEnum::INPUT_TYPE->value)
  ->options(FieldsEnum::getOptions())
  ->disabled(fn (Get $get) => $get(FormFieldKeysEnum::NOTED->value))
  ->dehydrated(),

Here I'm already using JS to set the state, but I would like to disable field as well using JS to avoid full component refresh.

this line cause the toggle to take 2-3 seconds to update, even with

afterStateUpdatedJs

afterStateUpdatedJs

->disabled(fn (Get $get) => $get(FormFieldKeysEnum::NOTED->value))

->disabled(fn (Get $get) => $get(FormFieldKeysEnum::NOTED->value))

NB: this is only a little portion of the fields in repeater.

partial rendering doesn't seem to help here...

Can we disable field from JS

Similar Threads

Can we disable field from JS

Similar Threads

Similar Threads

Similar Threads