Programmatically change the content of the file field

Kirby 3 Solved ✅
16

How to listen to events of changing the value of fields using Kirby? Can you enlist your help and get links to the CMS Kirby documentation section to implement each of the steps you have proposed?

  • Your code has to listen to a change in that field even before that change is stored anywhere on the server
  • When a change happens, your code has to get the value from that field (from the content store) and query the files and tags via a route/endpoint.
  • Then insert the results on the fly into the other fields.
    I would be very grateful!
17

You have to look into the custom field documentation:

Both your tags field and the files field need a listener.

Then you can get the value from the content store: https://getkirby.com/docs/reference/plugins/internals/store-content

Custom API endpoints: https://getkirby.com/docs/reference/plugins/extensions/api#custom-endpoints

1 Like
18

Thank you very much for the information. They will study and implement their plans.

19

I wonder if it would make sense to create a custom set of fields for this purpose rather than individual fields that do the same thing.

21

I haven’t seen Pages Field in the UI Kits.
Otherwise, how can I work with the field and hang an event listener on it?

22

Looks like it is missing, don’t know why.

23

Since he is not there, then there is no way to interact with him? And accordingly, I can’t hang an event listener on it so that the second field understands the page has changed or not?

24

It doesn’t mean any such thing. The UI Kit is intended for you to use in your own Panel extensions. Has nothing to do with you being able to work with that field from your code.

Plus the fact that it is not documented for whatever reason, doesn’t mean you can’t use this field type.

If you want to address a particular field, you have to get it by it’s name, not type anyway.

25

Tell me, what am I doing wrong? I did everything according to the instructions. But when I try to select a page in a custom floor, the panel gives an error: Cannot read property ‘field’ of undefined

index.php
index.php830×353 10.5 KB

index.js
index.js848×264 10.3 KB
vue
vue841×134 9.52 KB
field_pages
field_pages956×153 2.91 KB
field_pages_error
field_pages_error964×107 1.19 KB

26

Did it compile without errors?

And please don’t post code in screenshots, we cannot test it then. You can copy and paste it here. Thank you.

27

Yes, everything compiled without errors.

<?php

Kirby::plugin('denis/custom', [

    'fields' => [

        'custom' => [

            'extends' => 'pages',

            'props' => [

            ]

        ]

    ]

]);

import CustomField from "./components/CustomField.vue";

panel.plugin("denis/custom", {

  fields: {

    custom: CustomField

  }

});

<template>

  <k-pages-field v-model="pages" name="pages" label="Pages" />

</template>
28

Sorry, but is there any information about the error when selecting the page?

29

Have you checked the browser console?

In fact, the field should at least appear in the page with your code, but then all the rest will not work because the logic is missing.

30

A field appears. But after pressing the select button, it gives an error. I wrote about this yesterday. What kind of logic are you talking about?

31

If you look at the original field, it imports the filepicker mixin and does all sorts of other stuff. It won’t just work by putting a simple template into the CustomField.vue file.

But I’ve never extended a field myself yet, so can’t really tell you much about it. Looking at example fields in existing plugins can probably help.

You can find some fields here: https://getkirby.com/plugins?category=panel

You can find the original field vue files here: https://github.com/getkirby/kirby/tree/master/panel/src/components/Forms/Field

32

Thank you again. You are constantly helping out. I will sort this out.

33

Sorry I can’t help you more with this… We definitely need more docs.

34

And can I just expand the field. Around the same way I can do this in a .js file?

panel.plugin("your/plugin", {
  fields: {
    hello: {
      extends: "k-text-field"
    }
  }
});

Or I can ask the question for https://forum.getkirby.com/u/bastianallgeier/summary ?

35

@distantnative, @bastianallgeier Can you provide any insights, please?

36

We are definitely lacking docs for custom field implementations. I’m really sorry about that. Please give me some time to setup an example for this today and get back to you.

1 Like