How to retrieve selected node guid using the generated provider functions.

Hosam Abdeltawab asked on August 28, 2020 19:24

I have created a page type called CallToAction to be used for a widget. Kentico's CMS provides both a model and a provider code files. In my CallToAction widget properties file. I have two properties, SelectedNodeGuid, Layout, and LayoutOptions. For the SelectedNodeGuid, I want it to be a dropdown for all the pages with the page-type CallToAction and when I select one of them, it saves the nodeGuid for the selected page. How might I do that? Is there a specific attribute I should add on the SelectedNodeGuid field?

Here is my code:

CallToActionWidgetProperties.cs:

    using Kentico.Forms.Web.Mvc;
    using Kentico.PageBuilder.Web.Mvc;
    using CMS.DocumentEngine.Types.Gwic;
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;

    namespace AE.Web.Gwic.Models.Widgets.CallToActionWidget
    {
        public class CallToActionWidgetProperties : IWidgetProperties
        {
            public string SelectedNodeGuid { get; set; }

            /// <summary>
            /// The layout
            /// </summary>
            [EditingComponent(DropDownComponent.IDENTIFIER, ExplanationText = "Select the layout to be used", Order = 1, Label = "Layout", DefaultValue = "")]
            [EditingComponentProperty(nameof(DropDownProperties.DataSource), LayoutOptions)]
            public string Layout { get; set; }

            public const string LayoutOptions =
               @";Please select a layout;
                    CTA_Primary;Article Teaser;
                    CTA_Info;CTA Info;";
        }
    }

kentico 12 mvc widget properties

Correct Answer

Liam Goldfinch answered on August 29, 2020 12:06

Hi Hosam

Does it need to be a dropdown?

If it does need to be a dropdown with only the specified page type, you'll need to create a custom form component. A good example of this is actually on the Kentico documentation too, it's doing pretty much what you're wanting to do, see here: https://docs.kentico.com/k12sp/developing-websites/form-builder-development/developing-form-components/using-a-dynamic-data-source-with-selector-components

If you're not fussed about it being a dropdown, a good alternative is to just use Kentico 12 Service Pack's Page Selector. Only issue with using this is that I don't think there's an easy way to filter down to just the one page type. Example code from the documentation:

// Assigns a selector component to the Pages property
[EditingComponent(PageSelector.IDENTIFIER)]
// Limits the selection of pages to a subtree rooted at the 'Products' page
[EditingComponentProperty(nameof(PageSelectorProperties.RootPath), "/Products")]
// Returns a list of page selector items (node GUIDs)
public IList<PageSelectorItem> Pages { get; set; }

The above initialises a page selector form component which bring up a modal to select a page using the tree. If you use the RootPath attribute then you can filter the tree to just be that part of the site's tree, so what you could do if you're placing all of your CallToAction pages in the same folder (e.g. "Call To Actions"), then you could set a RootPath like this:

[EditingComponentProperty(nameof(PageSelectorProperties.RootPath), "/Call-To-Actions")]

With this form component returning an IList<PageSelectorItem> rather than just the NodeGuid you're looking to store, in your widget controller to you'll need to access it like this:

// Retrieves the node GUID of the selected page from the 'Pages' property
Guid? selectedPageGuid = GetProperties().Pages?.FirstOrDefault()?.NodeGuid;

The widget controller can then use this NodeGuid and the Kentico generated class/provider to get the correct document for use within the widget.

1 votesVote for this answer Unmark Correct answer