How to conditionally disable any field using a toggle field?

Kirby 4 Issues 🪲
,
1

Hey all.
I would like to disable a panel field when a toggle is set. It is already possible to show or hide a field using the conditional method:

when:
  toggle: true

However, this does not seem to be possible with the disabled field. I tried the following two obvious methods but neither worked. I am uncertain whether I made a mistake or not. I really feel that this should be possible somehow without writing a page hook or the like.

I tried using this:

disabled: "{{ page.toggle }}"

and

disabled: "{{ page.toggle.toBool() }}"

The field value is correctly set, however, it is only registered as "Text" and not as a boolean value. I can’t leave off the quotes or it does not work, right? I feel like the disabled field ought to check if the text is set to true or false and then take that as the boolean value. It would be a fast and elegant fix to the problem.

If this is not intended, then would it be possible to do the following?:

disabled:
  when: 
    toggle: true

To summarize: I would like to disable a/any field using a toggle field. I am uncertain if I made a mistake or if this function is simply missing.

Feedback would be much appreciated. Can the legendary @texnixe help, perhaps?
Many thanks in advance.

2

The problem is that the disabled prop doesn’t support query language out of the box. So you need a custom field that overwrites the disabled prop, as I suggested in this thread: Dynamic default number field - #2 by texnixe

Keep in mind that this does not work on the fly, for changes of the toggle field to reflect for the field that depends on this value, you need to save the page and reload. Because loading of the blueprint happens on the server side.

Or you would have to create a custom field that works similarly to the slug field and listens to changes on the frontend.

This cannot possibly work, because when is a field property, not an field option property.

1 Like
3

Thank you texnixe for the super fast response!
Your suggested method looks like it may be a solution for me. I don’t mind the required page reload.
I also realise now that I did not fully comprehend the problem. I tried the query language on a text field and it returned the boolean toggle value correctly. I thought it was a type (text instead of bool) problem. I still feel the option to disable a field using another toggle field should be easier than writing a custom field, but I am happy that it should be possible.
Thank you for the fast help!

4

As you can see, implementing query language support is pretty easy, but the main problem why this is probably not implemented by default is the shortcoming of the workaround I explained above. For this to be a proper feature, those properties would have to listen to changes in other fields on the client side.