[CMS] SHOW/HIDE PROPERTIES ON SPECIFIC CONDITIONS IN CMS EDITOR

In some of my recent discussions with CMS developers, I saw one simple and easy, yet a trick question around Custom Attribute and Conditional Properties.

One of such question was like, How would you Show OR Hide a property in the site, on a specified conditional property ???

Sounds simple, rite!

But the catch sometimes is, we have learned so much about advanced features, that we overlook at these basic implementations. And thats when you get caught with tricky yet simple implementations :)

So here is the article which will help you refresh your knowledge, and give a revived, step-wise guide, with implementation, for this query.

Let's begin.

Rephrashing The Requirement:

We want a property which has few options; 
- which when set [Hide] "Option 1" - Should be able to hide "Option 1" from your defined pagetype on the site editor view.
- which when set [Hide] "Option 2" - Should be able to hide "Option 2" from your defined pagetype on the site editor view.
And default should be, if no [Hide] "Option" is set; all properties should be visible.

Solution:

Step 1:

Create an Enum Dropdown Option on one defined page. 
We will take this as Start Page.

[Display(GroupName = Global.GroupNames.SiteSettings, Name ="Choose Option To Hide")]
public virtual string DropdownOptions { get; set; }

Step 2:
Provide a Dropdown List'ss Options to it.

public enum DropDownEnumsList
    {
        [EnumSelectionDescription(Text = "Option 1", Value = "Option 1")]
        Option1,
        [EnumSelectionDescription(Text = "Option 2", Value = "Option 2")]
        Option2
    }

public class EnumSelectionDescriptionAttribute : DescriptionAttribute
    {
        public string Text { get; set; }

        public object Value { get; set; }
	}

public class SelectOneEnumAttribute : SelectOneAttribute, IMetadataAware
    {
        public SelectOneEnumAttribute(Type enumType)
        {
            EnumType = enumType;
        }

        public Type EnumType { get; set; }

        public new void OnMetadataCreated(ModelMetadata metadata)
        {
            SelectionFactoryType = typeof(EnumSelectionFactory<>).MakeGenericType(EnumType);

            base.OnMetadataCreated(metadata);
        }
    }

Step 3:
Update Property On StartPage

[Display(GroupName = Global.GroupNames.SiteSettings, Name ="Choose Option To Hide")]
        [SelectOneEnum(typeof(DropDownEnumsList))]
        public virtual string DropdownOptions { get; set; }

Step 4:
Create Show/Hide Properties in one of PageTypes (In our example we will refer to "NewsPage")

public virtual bool Option1 { get; set; }

public virtual bool Option2 { get; set; }

Step 5:
Create Attribute Class Show/Hide

public class HideSpecificPropertyAttribute : Attribute
    {
        public string SelectedDropDownOption { get; set; }
    }

Step 6:
Write Editor Descriptor for Show/Hide Class

public class HidePropertyOnSpecificCondition : EditorDescriptor
    {
        private readonly IContentLoader _contentLoader;
        public HidePropertyOnSpecificCondition(IContentLoader contentLoader)
        {
            _contentLoader = contentLoader;
        }
        public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes)
        {
            base.ModifyMetadata(metadata, attributes);

            var startPageContentLink = SiteDefinition.Current.StartPage;

            var startPage = _contentLoader.Get<StartPage>(startPageContentLink);


            foreach (var property in metadata.Properties)
            {
                if (property is ContentDataMetadata contentDataMetadata)
                {
                    var hidePropertyInSpecificSiteAttribute = contentDataMetadata.Attributes.FirstOrDefault(x => x is HideSpecificPropertyAttribute) as HideSpecificPropertyAttribute;

                    if (hidePropertyInSpecificSiteAttribute != null && string.Equals(
                            hidePropertyInSpecificSiteAttribute.SelectedDropDownOption, startPage.DropdownOptions,
                            StringComparison.InvariantCultureIgnoreCase))
                    {
                        property.ShowForEdit = false;
                    }
                }

            }
        }
    }

Step 7:
Update Show/Hide Properties with Attribute Details

	[HideSpecificProperty(SelectedDropDownOption = nameof(DropDownEnumsList.Option1))]
        public virtual bool Option1 { get; set; }

        [HideSpecificProperty(SelectedDropDownOption = nameof(DropDownEnumsList.Option2))]
        public virtual bool Option2 { get; set; }

Step 8: [Golden Step]
Add typeOf Details on Editor Descriptor at the top of all methods, to make it work for you :)

[EditorDescriptorRegistration(TargetType = typeof(ContentData))]

And there you go...

Happy Learning :)

Thank you.