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?
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.
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
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.
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>Sorry, but is there any information about the error when selecting the page?
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.
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?
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
Thank you again. You are constantly helping out. I will sort this out.
Sorry I can’t help you more with this… We definitely need more docs.
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 ?
@distantnative, @bastianallgeier Can you provide any insights, please?
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
Ок. Thank you!
I’m really sorry, but after diving a bit deeper I found that it’s not possible to solve your particular case in a non-hackish way with our field plugins at the moment.
As mentioned above, the queries in the blueprints are done on the server. Thus, you have to store the result of the gallery field first before the other fields can react to it.
This is possible in theory, but it’s not very elegant and has a couple unwanted side effects.
Here’s still how you could do this in a custom pages field.
<?php
Kirby::plugin('example/gallery', [
'fields' => [
'gallery' => [
'extends' => 'pages'
]
]
]);
panel.plugin("example/gallery", {
fields: {
gallery: {
extends: "k-pages-field",
methods: {
onInput() {
this.$emit("input", this.selected);
this.$store.dispatch("content/save");
}
}
}
}
});
It’s important that the field definition in the PHP file also extends the pages field. That’s why your first try didn’t work.
You can then overwrite the onInput method of the pages field component, which will be triggered whenever a selection in the pages picker is made.
When you save the content directly after such a selection, the page view will be rerendered and you get what you are looking for. But it has a nasty side effect of a flickering safe bar and also could lead to broken file relations in the files picker, if you switch the gallery.
I’m sorry I cannot provide a better solution.
Thanks for your reply! It seems to me that I’m just trying too hard to idealize my ideas for a solution.
1 Like
Hi, I am trying to implement a similar thing. I am not getting the full picture here. Is there a working example that I could try out to understand the approach?
I would like to be able to populate a select field, with a list of blocks from a page. The page needs to be selected first of course.
Page: select → Block: select