How to create Custom Attribute for Property Item

[qubess]

I want to create custom attribute data annotation for property item and its value should be accessible/reflect in typescript Slick.Column
For example:
HeaderCssClass
CssClass
Tab

Likewise, I want to create ColumnGroup property.

Your earliest support would be much appreciated.

[minhhungit]

Hello @qubess I have just checked Serenity code and found a way

You need to create a custom attribute:

using Serenity.ComponentModel;
using Serenity.PropertyGrid;

public class MyCustomAttribute : Attribute
    {
        public MyCustomAttribute(string myValue)
        {
            MyValue = myValue;
        }

        public string MyValue { get; private set; }
    }

And implement PropertyProcessor:

    public partial class BasicPropertyProcessor_MyCustom : PropertyProcessor
    {
        public override void Process(IPropertySource source, PropertyItem item)
        {
            base.Process(source, item);
            setMyCustomValue(source, item);
        }

        private void setMyCustomValue(IPropertySource source, PropertyItem item)
        {
            var attr = source.GetAttribute<MyCustomAttribute>();
            var key = "myCustom";

            if (attr != null)
            {
                // I'm not sure about this code, but it looks work
                if (item.ExtensionData.ContainsKey(key))
                {
                    item.ExtensionData[key] = attr.MyValue; // maybe we should throw exception here if we have duplicate property
                }
                else
                {
                    item.ExtensionData.Add(key, attr.MyValue);
                }
            }
        }
    }

That's it, Serenity will does the rest for you

In your Column.cs, use your attribute like others

[EditLink, Width(200)]
[MyCustom("jin")]
public String Name { get; set; }

To see result, inherit getPropertyItems method of Serenity.EntityGrid

protected getPropertyItems() {
            let p = super.getPropertyItems();
            console.log(p);
            return p;
        }

F12 and check your console

!!! Remember that I have just found this solution, I have never use it before in production, so it might be incorrect.

[qubess]

Thanks a lot, very much appreciated.

[minhhungit]

Use this version in case you want your custom property has children props, like this

public class MyCustomAttribute : Attribute
    {
        public MyCustomAttribute(string myValue, string mySecondValue)
        {
            MyValue = myValue;
            MySecondValue = mySecondValue;
        }

        public string MyValue { get; private set; }
        public string MySecondValue { get; private set; }
    }

    public partial class BasicPropertyProcessor : PropertyProcessor
    {
        public override void Process(IPropertySource source, PropertyItem item)
        {
            base.Process(source, item);
            setMyCustomValue(source, item);
        }

        private void setMyCustomValue(IPropertySource source, PropertyItem item)
        {
            var attr = source.GetAttribute<MyCustomAttribute>();
            var key = "myCustom";

            if (attr != null)
            {
               // re-custom child props name with key Abc and Xyz
                var proValue = JToken.FromObject(new { Abc = attr.MyValue, Xyz = attr.MySecondValue });

                if (item.ExtensionData.ContainsKey(key))
                {
                    item.ExtensionData[key] = proValue; // here maybe we should throw exception
                }
                else
                {
                    item.ExtensionData.Add(key, proValue);
                }
            }
        }
    }

Column.cs

[EditLink, Width(200)]
        [MyCustom(myValue: "Jin", mySecondValue: "Test second value")]
        public String Name { get; set; }

[qubess]

I am using Assembly Serenity.Core Version=3.3.11.0 and this version doesn't have PropertyItem.ExtensionData property. I have checked your code in latest version of Serenity, it works but unfortunately, my production website is built on Serenity 3.3.11.0 version.

If you don't mind can you suggest me solution which is compatible with my version

[minhhungit]

I have no idea, you might need to upgrade to higher version