How to display the componentProperties options by the selected option in the dropdown?

Question

I'm sure this is very simple but it's proving just a bit beyond me at the moment.

I have made a plugin that I would like to use for displaying galleries which is working fine. However, trying to add the options of the galleries that I have created in my component is proving to be difficult.

When I add the component to a page, I have now got the option to choose all the galleries that I created but displaying the gallery based upon which one I selected is what I have been unsuccessful in doing.

Any help would be greatly appreciated!

I'm sure this is very simple but it's proving just a bit beyond me at the moment.

I have made a plugin that I would like to use for displaying galleries which is working fine. However, trying to add the options of the galleries that I have created in my component is proving to be difficult.

When I add the component to a page, I have now got the option to choose all the galleries that I created but displaying the gallery based upon which one I selected is what I have been unsuccessful in doing.

Any help would be greatly appreciated!

Components/Gallery.php:

use Cms\Classes\ComponentBase;
use MartinSmith\Gallerys\Models\Gallery as GalleryModel;

class gallerys extends ComponentBase
{
public $gallery;

public function componentDetails(){
    return [
        'name' => 'Frontend Gallery',
        'description' => 'A gallery for you webpage'
    ];
}

public function defineProperties() {
    $lists = $this->getLists();
    return [
        'galleryName' => [
            'title' => 'Gallery',
            'type' => 'dropdown',
            'placeholder' => 'Select Gallery',
            'options' => $lists
        ]
    ];
}

public function getLists() {
    $agreements = GalleryModel::all()->pluck('name', 'id');
    return $agreements->toArray();
}

public function getList() {
    $agreement = GalleryModel::where('id', $this->property('galleryName'))->get();
    return $agreement->first();
}

}

Components/gallery/default.htm:

{% set gallerys = __SELF__.gallery %}

{% for gallery in gallerys %}

<div class="container-fluid px-0">

    <div class="gallery">

        <div class="row">

            {% for image in gallery.fullImage %}

            <div class="col-md-4 px-0 home-galleryImg">

                <a href="{{ image.path }}">

                    <div class="gallery-imgOverlay">
                        <p>{{ image.title }}</p>
                        <h5>{{ image.description }}</h5>
                    </div>

                    <img class="img-fluid" src="{{ image.thumb(650,auto) }}" alt="{{ thumbnail.description }}">

                </a>

            </div>

            {% endfor %}

        </div>

    </div>

</div>

{% endfor %}

See screenshot

Answer 1

I solved this for myself by creating a function that returns the "name" and indexed by the 'id' using the laravel pluck method. pluck('name', 'id') The first argument selects the column to use as the value and the second argument selects the column to use as a key. Note* the toArray() method I don't think the options field can take collections.

public function getLists() {
    $agreements = Agreements::all()->pluck('agrnum', 'id');
    return $agreements->toArray();
}
//returns
array:3 [▼
  2 => "DLE-2"
  4 => "DLE-1"
  5 => "DLE-3"
]

Now in my properties area I call the function $list = $this->getList();

public function defineProperties() {
$lists = $this->getLists();
return [
    'getList' => [
        'title' => 'List',
        'type' => 'dropdown',
        'placeholder' => 'Select List',
        'options'     => $lists
       ]
    ];
}

After that you can proceed to do a Lists::where('id', $this->property('getList')); or something of that sort in a function to show the selected list or in your case gallery.

My results: The CMS Page Backend from component

    public function defineProperties() {
    $lists = $this->getLists();
    return [
        'getList' => [
            'title' => 'List',
            'type' => 'dropdown',
            'placeholder' => 'Select List',
            'options'     => $lists
           ]
        ];
    }

    public function getLists() {
    $agreements = Agreements::all()->pluck('agrnum', 'id');
    return $agreements->toArray();
    }

    public function getList() {
        $agreement = Agreements::where('id', $this->property('getList'))->get();
        return $agreement->first();
    }

The Webpage from default.htm in the component template folder

{{ d(__SELF__.getList) }}

Also if I do {{ d(__SELF__.property('getList')) }} it shows me the value is "5".