Custom Tag - how to?

Update: Using description here: https://api.daypilot.org/daypilot-event-data/, I have changed my code, to use args.e.data.tags instead of args.e.tag:

...
dp.dataTagFields = "value"; // <- REMOVED
...
dp.onEventMoved = function (args) {
console.log(args.e);
args.e.data.tags = {
value: 101
};
dp.events.update(args.e);
};

Testing on next onEventMoved with
console.log(args.e.tag("value"));

• > error: undefined

console.log(args.e.data.tags.value);

• > error: undefined

Your second example seems to work fine for me (in both AngularJS and plain JavaScript version).

Just a couple of comments:

1. As you have noticed already, dataTagFields is not used in the JavaScript version.

2. Typically, the database id is stored in "id" property of the source event object. That property is required - it is used to find and compare events. See also https://api.daypilot.org/daypilot-event-data/

3. If you are modifying args.e.data you don't need to call dp.events.update(args.e) - unless you want to redraw the event. The "data" object holds a reference to the original source object (from dp.events.list). So any change made to args.e.data will have an immediate effect. The calendar component only modifies the following fields (if necessary): start, end, resource. Other properties remain untouched.

4. You can also define custom properties directly on the source data object (instead of data.tags). Just make sure it doesn't interfere with the internal properties. Using data.tags makes that easier as "tags" is reserved for this purpose.

5. The data object will get replaced only if you reload the data (dp.events.list in JavaScript, "events" attribute in AngularJS).

Let me know if it still doesn't work.

Thank you, Dan.
I found a couple of places where I did not use the correct property - ie. args.e.tags.value instead of correctly args.e.data.tags.value. After fixing those, db save works.

Thanks also for clarifying how to work with the component.