pict-section-form 1.0.122 → 1.0.124

package/example_applications/Build-Examples.sh

@@ -30,6 +30,11 @@ pushd simple_form
 npm install && npm run build
 popd
 
+# Building simple_distill
+pushd simple_distill
+npm install && npm run build
+popd
+
 # Building simple_table
 pushd simple_table
 npm install && npm run build

package/example_applications/Clean-Examples.sh

@@ -5,5 +5,6 @@ rm -rf ./complex_tuigrid/dist
 rm -rf ./gradebook/dist
 rm -rf ./manyfest_editor/dist
 rm -rf ./postcard_example/dist
+rm -rf ./simple_distill/dist
 rm -rf ./simple_form/dist
-rm -rf ./simple_table/dist
+rm -rf ./simple_table/dist

package/example_applications/Open-Examples.sh

@@ -4,5 +4,6 @@ open ./complex_table/dist/index.html
 open ./complex_tuigrid/dist/index.html
 open ./gradebook/dist/index.html
 open ./postcard_example/dist/index.html
+open ./simple_distill/dist/index.html
 open ./simple_form/dist/index.html
-open ./simple_table/dist/index.html
+open ./simple_table/dist/index.html

package/example_applications/postcard_example/providers/PictProvider-PostKardInputExtension.js

@@ -7,17 +7,48 @@ class CustomInputHandler extends libPictFormSection.PictInputExtensionProvider
 		super(pFable, pOptions, pServiceHash);
 	}
 
-	onEvent(pView, pInput, pValue, pHTMLSelector, pEvent)
+	/**
+	 * @param {import('../../../source/views/Pict-View-DynamicForm.js')} pView
+	 * @param {Object} pInput
+	 * @param {any} pValue
+	 * @param {string} pHTMLSelector
+	 * @param {string} pEvent
+	 * @param {string} pTransactionGUID
+	 */
+	onEvent(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID)
 	{
-		console.log(`Alert alert event happened for ${pInput}: ${pEvent}`);
-		return super.onEvent(pView, pInput, pValue, pHTMLSelector, pEvent);
+		console.log(`Alert alert event happened for ${pInput}: ${pEvent} [${pTransactionGUID}]`);
+		pView.registerEventTransactionAsyncOperation(pTransactionGUID, 'testAsyncOp');
+		pView.registerOnTransactionCompleteCallback(pTransactionGUID, () =>
+		{
+			this.pict.log.info(`Transaction ${pTransactionGUID} is complete!`);
+		});
+		setTimeout(() =>
+		{
+			pView.eventTransactionAsyncOperationComplete(pTransactionGUID, 'testAsyncOp');
+		}, 5000);
+		return super.onEvent(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID);
 	}
 
-	onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent)
+	/**
+	 * @param {import('../../../source/views/Pict-View-DynamicForm.js')} pView
+	 * @param {Object} pInput
+	 * @param {any} pValue
+	 * @param {string} pHTMLSelector
+	 * @param {string} pEvent
+	 * @param {string} pTransactionGUID
+	 */
+	onAfterEventCompletion(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID)
 	{
-		console.log(`Alert alert event happened for ${pInput} row ${pRowIndex}: ${pEvent}`);
-		return super.onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent);
+		this.pict.log.info(`After event completion for ${pInput}: ${pEvent} [${pTransactionGUID}]`);
+		super.onAfterEventCompletion(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID);
+	}
+
+	onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent, pTransactionGUID)
+	{
+		console.log(`Alert alert event happened for ${pInput} row ${pRowIndex}: ${pEvent} [${pTransactionGUID}]`);
+		return super.onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent, pTransactionGUID);
 	}
 }
 
-module.exports = CustomInputHandler;
+module.exports = CustomInputHandler;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "pict-section-form",
-    "version": "1.0.122",
+    "version": "1.0.124",
     "description": "Pict dynamic form sections",
     "main": "source/Pict-Section-Form.js",
     "directories": {
@@ -31,7 +31,7 @@
         "browser-env": "^3.3.0",
         "eslint": "^9.36.0",
         "jquery": "^3.7.1",
-        "pict": "^1.0.307",
+        "pict": "^1.0.308",
         "pict-application": "^1.0.29",
         "pict-service-commandlineutility": "^1.0.15",
         "quackage": "^1.0.42",

package/source/providers/Pict-Provider-DynamicFormSolverBehaviors.js

@@ -264,7 +264,7 @@ class PictDynamicFormsSolverBehaviors extends libPictProvider
 		}
 
 		let tmpElementSet = this.pict.ContentAssignment.getElement(this.getGroupSelector(tmpGroupView.formID, pGroupHash));
-		
+
 		if (tmpElementSet.length < 1)
 		{
 			this.log.warn(`PictDynamicFormsInformary: colorGroup could not find group element with section hash [${pSectionHash}] group [${pGroupHash}] selector [${this.getGroupSelector(tmpGroupView.formID, pGroupHash)}].`);
@@ -277,7 +277,16 @@ class PictDynamicFormsSolverBehaviors extends libPictProvider
 		return true;
 	}
 
-	colorInputBackground(pSectionHash, pInputHash, pColor, pApplyChange)
+	/**
+	 * Colors an input background or its container with a HTML hex color (e.g. #FF0000 for red).
+	 * @param {string} pSectionHash - The hash of the section containing the input.
+	 * @param {string} pInputHash - The hash of the input to color.
+	 * @param {string} pColor - The HTML hex color to apply (e.g. #FF0000 for red).
+	 * @param {string} pApplyChange - If "0", the change will not be applied.
+	 * @param {string} [pClassTarget] - Optional. If provided, the color will be applied to the closest element with this class instead of the input itself.
+	 * @returns {boolean} - Returns true if the color was applied successfully or if the change was skipped for pApplyChange equal to "0", false otherwise.
+	 */
+	colorInputBackground(pSectionHash, pInputHash, pColor, pApplyChange, pClassTarget)
 	{
 		if (pApplyChange == "0")
 		{
@@ -308,12 +317,25 @@ class PictDynamicFormsSolverBehaviors extends libPictProvider
 			return false;
 		}
 
-		// if there's a parent element, use that instead and we can color the whole input container area
-		if (tmpElementSet[0].parentElement)
+		let tmpElement = tmpElementSet[0];
+
+		// if we passed a class target, find the closest element with that class and apply the color to it
+		// otherwise, just apply it to the input element itself
+		if (pClassTarget)
 		{
-			tmpElementSet = [ tmpElementSet[0].parentElement ];
+			// find closest target by class name and if we find it, immediately break out of the loop
+			for (let i = 0; i < tmpElementSet.length; i++)
+			{
+				const element = tmpElementSet[i];
+				const closest = element.closest(`.${pClassTarget}`);
+				if (closest)
+				{
+					tmpElement = closest;
+					break;
+				}
+			}
 		}
-		let tmpElement = tmpElementSet[0];
+
 		tmpElement.style.backgroundColor = pColor;
 
 		return true;

package/source/providers/Pict-Provider-DynamicInputEvents.js

@@ -75,9 +75,11 @@ class PictDynamicInputEvents extends libPictProvider
 	 * @param {Object} pView - The view object.
 	 * @param {string} pInputHash - The input hash.
 	 * @param {string} pEvent - The input event.
+	 * @param {string} [pTransactionGUID] - (optional) The active transaction GUID.
 	 */
-	inputEvent(pView, pInputHash, pEvent)
+	inputEvent(pView, pInputHash, pEvent, pTransactionGUID)
 	{
+		const tmpTransactionGUID = (pTransactionGUID && typeof pTransactionGUID === 'string') ? pTransactionGUID : this.pict.getUUID();
 		let tmpInput = pView.getInputFromHash(pInputHash);
 		if (pInputHash)
 		{
@@ -94,7 +96,11 @@ class PictDynamicInputEvents extends libPictProvider
 						// we may find uninitialized inputs here, so we do not send events to those
 						if (tmpInput.Macro)
 						{
-							pView.pict.providers[tmpInputProviderList[i]].onEvent(pView, tmpInput, tmpValue, tmpInput.Macro.HTMLSelector, pEvent);
+							pView.pict.providers[tmpInputProviderList[i]].onEvent(pView, tmpInput, tmpValue, tmpInput.Macro.HTMLSelector, pEvent, tmpTransactionGUID);
+							pView.registerOnTransactionCompleteCallback(tmpTransactionGUID, () =>
+							{
+								pView.pict.providers[tmpInputProviderList[i]].onAfterEventCompletion(pView, tmpInput, tmpValue, tmpInput.Macro.HTMLSelector, pEvent, tmpTransactionGUID);
+							});
 						}
 					}
 					else
@@ -102,6 +108,11 @@ class PictDynamicInputEvents extends libPictProvider
 						pView.log.error(`Dynamic form [${pView.Hash}]::[${pView.UUID}] inputEvent ${pEvent} cannot find embedded provider [${tmpInputProviderList[i]}] for input [${tmpInput.Hash}].`);
 					}
 				}
+				if (pTransactionGUID !== tmpTransactionGUID)
+				{
+					// since we synthesized this transaction, finalize it
+					pView.finalizeTransaction(tmpTransactionGUID);
+				}
 			}
 			catch (pError)
 			{
@@ -171,9 +182,11 @@ class PictDynamicInputEvents extends libPictProvider
 	 * @param {number} pInputIndex - The index of the input.
 	 * @param {number} pRowIndex - The index of the row.
 	 * @param {string} pEvent - The input event.
+	 * @param {string} [pTransactionGUID] - (optional) The active transaction GUID.
 	 */
-	inputEventTabular(pView, pGroupIndex, pInputIndex, pRowIndex, pEvent)
+	inputEventTabular(pView, pGroupIndex, pInputIndex, pRowIndex, pEvent, pTransactionGUID)
 	{
+		const tmpTransactionGUID = (pTransactionGUID && typeof pTransactionGUID === 'string') ? pTransactionGUID : this.pict.getUUID();
 		let tmpInput = pView.getTabularRecordInput(pGroupIndex, pInputIndex);
 		if (pGroupIndex != null && pInputIndex != null && pRowIndex != null && tmpInput)
 		{
@@ -191,13 +204,22 @@ class PictDynamicInputEvents extends libPictProvider
 				{
 					if (pView.pict.providers[tmpInputProviderList[i]])
 					{
-						pView.pict.providers[tmpInputProviderList[i]].onEventTabular(pView, tmpInput, tmpValue, tmpVirtualInformaryHTMLSelector, pRowIndex, pEvent);
+						pView.pict.providers[tmpInputProviderList[i]].onEventTabular(pView, tmpInput, tmpValue, tmpVirtualInformaryHTMLSelector, pRowIndex, pEvent, tmpTransactionGUID);
+						pView.registerOnTransactionCompleteCallback(tmpTransactionGUID, () =>
+						{
+							pView.pict.providers[tmpInputProviderList[i]].onAfterEventTabularCompletion(pView, tmpInput, tmpValue, tmpVirtualInformaryHTMLSelector, pRowIndex, pEvent, tmpTransactionGUID);
+						});
 					}
 					else
 					{
 						pView.log.error(`Dynamic form [${pView.Hash}]::[${pView.UUID}] cannot find embedded provider [${tmpInputProviderList[i]}] for input [${tmpInput.Hash}] row ${pRowIndex} calling inputEvent ${pEvent}.`);
 					}
 				}
+				if (pTransactionGUID !== tmpTransactionGUID)
+				{
+					// since we synthesized this transaction, finalize it
+					pView.finalizeTransaction(tmpTransactionGUID);
+				}
 			}
 			catch (pError)
 			{

package/source/providers/Pict-Provider-DynamicSolver.js

@@ -47,7 +47,7 @@ class PictDynamicSolver extends libPictProvider
 
 		/** @type {import('pict')} */
 		this.pict;
-		/** @type {import('pict') & { instantiateServiceProviderIfNotExists: (hash: string) => any }} */
+		/** @type {import('pict') & { instantiateServiceProviderIfNotExists: (hash: string) => any, ExpressionParser: any }} */
 		this.fable;
 		/** @type {any} */
 		this.log;

package/source/providers/Pict-Provider-InputExtension.js

@@ -65,9 +65,10 @@ class PictInputExtensionProvider extends libPictProvider
 	 * @param {Object} pRow - The Row index.
 	 * @param {Object} pInput - The input object.
 	 * @param {any} pValue - The value of the input object
+	 * @param {string} pTransactionGUID - The transaction GUID for the event dispatch.
 	 * @param {string} pHTMLSelector - The HTML selector for the input object
 	 */
-	onInputInitialize(pView, pGroup, pRow, pInput, pValue, pHTMLSelector)
+	onInputInitialize(pView, pGroup, pRow, pInput, pValue, pHTMLSelector, pTransactionGUID)
 	{
 		return true;
 	}
@@ -82,9 +83,10 @@ class PictInputExtensionProvider extends libPictProvider
 	 * @param {Object} pInput - The input object.
 	 * @param {any} pValue - The value of the input object
 	 * @param {string} pHTMLSelector - The HTML selector for the input object (it will return an array).
+	 * @param {string} pTransactionGUID - The transaction GUID for the event dispatch.
 	 * @param {number} pRowIndex - The row index of the tabular data
 	 */
-	onInputInitializeTabular(pView, pGroup, pInput, pValue, pHTMLSelector, pRowIndex)
+	onInputInitializeTabular(pView, pGroup, pInput, pValue, pHTMLSelector, pRowIndex, pTransactionGUID)
 	{
 		return true;
 	}
@@ -98,8 +100,9 @@ class PictInputExtensionProvider extends libPictProvider
 	 * @param {Object} pInput - The input object.
 	 * @param {any} pValue - The new value of the input object
 	 * @param {string} pHTMLSelector - The HTML selector for the input object
+	 * @param {string} pTransactionGUID - The transaction GUID for the event dispatch.
 	 */
-	onDataChange(pView, pInput, pValue, pHTMLSelector)
+	onDataChange(pView, pInput, pValue, pHTMLSelector, pTransactionGUID)
 	{
 		return true;
 	}
@@ -112,8 +115,9 @@ class PictInputExtensionProvider extends libPictProvider
 	 * @param {any} pValue - The new value of the input object
 	 * @param {string} pHTMLSelector - The HTML selector for the input object
 	 * @param {number} pRowIndex - The row index of the tabular data
+	 * @param {string} pTransactionGUID - The transaction GUID for the event dispatch.
 	 */
-	onDataChangeTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex)
+	onDataChangeTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pTransactionGUID)
 	{
 		return true;
 	}
@@ -127,9 +131,10 @@ class PictInputExtensionProvider extends libPictProvider
 	 * @param {Object} pInput - The input object.
 	 * @param {any} pValue - The value to marshal.
 	 * @param {string} pHTMLSelector - The HTML selector.
+	 * @param {string} pTransactionGUID - The transaction GUID for the event dispatch.
 	 * @returns {boolean} - Returns true if the data was successfully marshaled to the form.
 	 */
-	onDataMarshalToForm(pView, pGroup, pRow, pInput, pValue, pHTMLSelector)
+	onDataMarshalToForm(pView, pGroup, pRow, pInput, pValue, pHTMLSelector, pTransactionGUID)
 	{
 		return true;
 	}
@@ -143,9 +148,10 @@ class PictInputExtensionProvider extends libPictProvider
 	 * @param {any} pValue - The value to marshal.
 	 * @param {string} pHTMLSelector - The HTML selector.
 	 * @param {number} pRowIndex - The index of the input in the row columns.
+	 * @param {string} pTransactionGUID - The transaction GUID for the event dispatch.
 	 * @returns {boolean} - Returns true if the data was successfully marshaled to the form.
 	 */
-	onDataMarshalToFormTabular(pView, pGroup, pInput, pValue, pHTMLSelector, pRowIndex)
+	onDataMarshalToFormTabular(pView, pGroup, pInput, pValue, pHTMLSelector, pRowIndex, pTransactionGUID)
 	{
 		return true;
 	}
@@ -188,9 +194,43 @@ class PictInputExtensionProvider extends libPictProvider
 	 * @param {any} pValue - The value from AppData.
 	 * @param {string} pHTMLSelector - The HTML selector.
 	 * @param {string} pEvent - The event hash that is expected to be triggered.
+	 * @param {string} pTransactionGUID - The transaction GUID, if any.
 	 * @returns {boolean} - Returns true.
 	 */
-	onEvent(pView, pInput, pValue, pHTMLSelector, pEvent)
+	onEvent(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID)
+	{
+		return true;
+	}
+
+	/**
+	 * Handles events for the Pict-Provider-InputExtension.
+	 *
+	 * @param {Object} pView - The view object.
+	 * @param {Object} pInput - The input object.
+	 * @param {any} pValue - The value from AppData.
+	 * @param {string} pHTMLSelector - The HTML selector.
+	 * @param {string} pEvent - The event hash that is expected to be triggered.
+	 * @param {string} pTransactionGUID - The transaction GUID, if any.
+	 * @returns {boolean} - Returns true.
+	 */
+	onAfterEventCompletion(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID)
+	{
+		return true;
+	}
+
+	/**
+	 * Handles events for the Pict-Provider-InputExtension.
+	 *
+	 * @param {Object} pView - The view object.
+	 * @param {Object} pInput - The input object.
+	 * @param {any} pValue - The value from AppData.
+	 * @param {string} pHTMLSelector - The HTML selector.
+	 * @param {number} pRowIndex - The row index of the tabular data.
+	 * @param {string} pEvent - The event hash that is expected to be triggered.
+	 * @param {string} pTransactionGUID - The transaction GUID, if any.
+	 * @returns {boolean} - Returns true.
+	 */
+	onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent, pTransactionGUID)
 	{
 		return true;
 	}
@@ -204,9 +244,10 @@ class PictInputExtensionProvider extends libPictProvider
 	 * @param {string} pHTMLSelector - The HTML selector.
 	 * @param {number} pRowIndex - The row index of the tabular data.
 	 * @param {string} pEvent - The event hash that is expected to be triggered.
+	 * @param {string} pTransactionGUID - The transaction GUID, if any.
 	 * @returns {boolean} - Returns true.
 	 */
-	onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent)
+	onAfterEventTabularCompletion(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent, pTransactionGUID)
 	{
 		return true;
 	}

package/source/providers/inputs/Pict-Provider-Input-AutofillTriggerGroup.js

@@ -113,9 +113,10 @@ class CustomInputHandler extends libPictSectionInputExtension
 	 * @param {Object} pInput - The input object.
 	 * @param {any} pValue - The new value of the input.
 	 * @param {string} pHTMLSelector - The HTML selector of the input.
+	 * @param {string} pTransactionGUID - The transaction GUID, if any.
 	 * @returns {any} - The result of the super.onDataChange method.
 	 */
-	onDataChange(pView, pInput, pValue, pHTMLSelector)
+	onDataChange(pView, pInput, pValue, pHTMLSelector, pTransactionGUID)
 	{
 		let tmpTriggerGroupConfigurations = this.getTriggerGroupConfigurationArray(pInput);
 		if (Array.isArray(tmpTriggerGroupConfigurations) && this.pict.views.PictFormMetacontroller)
@@ -125,11 +126,13 @@ class CustomInputHandler extends libPictSectionInputExtension
 				const tmpGroupConfig = tmpTriggerGroupConfigurations[i];
 				if (tmpGroupConfig.TriggerAllInputs)
 				{
-					this.pict.views.PictFormMetacontroller.triggerGlobalInputEvent(`TriggerGroup:${tmpGroupConfig.TriggerGroupHash}:DataChange:${pInput.Hash || pInput.DataAddress}:${this.pict.getUUID()}`);
+					this.pict.views.PictFormMetacontroller.triggerGlobalInputEvent(
+						`TriggerGroup:${tmpGroupConfig.TriggerGroupHash}:DataChange:${pInput.Hash || pInput.DataAddress}:${this.pict.getUUID()}`,
+						pTransactionGUID);
 				}
 			}
 		}
-		return super.onDataChange(pView, pInput, pValue, pHTMLSelector);
+		return super.onDataChange(pView, pInput, pValue, pHTMLSelector, pTransactionGUID);
 	}
 
 	/**
@@ -140,9 +143,10 @@ class CustomInputHandler extends libPictSectionInputExtension
 	 * @param {any} pValue - The new value.
 	 * @param {string} pHTMLSelector - The HTML selector.
 	 * @param {number} pRowIndex - The index of the row.
+	 * @param {string} pTransactionGUID - The transaction GUID, if any.
 	 * @returns {any} - The result of the super method.
 	 */
-	onDataChangeTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex)
+	onDataChangeTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pTransactionGUID)
 	{
 		let tmpTriggerGroupConfigurations = this.getTriggerGroupConfigurationArray(pInput);
 		if (Array.isArray(tmpTriggerGroupConfigurations) && this.pict.views.PictFormMetacontroller)
@@ -152,17 +156,29 @@ class CustomInputHandler extends libPictSectionInputExtension
 				const tmpGroupConfig = tmpTriggerGroupConfigurations[i];
 				if (tmpGroupConfig.TriggerAllInputs)
 				{
-					this.pict.views.PictFormMetacontroller.triggerGlobalInputEvent(`TriggerGroup:${tmpGroupConfig.TriggerGroupHash}:DataChange:${pInput.Hash || pInput.DataAddress}:${this.pict.getUUID()}`);
+					this.pict.views.PictFormMetacontroller.triggerGlobalInputEvent(
+						`TriggerGroup:${tmpGroupConfig.TriggerGroupHash}:DataChange:${pInput.Hash || pInput.DataAddress}:${this.pict.getUUID()}`,
+						pTransactionGUID);
 				}
 			}
 		}
-		return super.onDataChangeTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex);
+		return super.onDataChangeTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pTransactionGUID);
 	}
 
-	// This input extension only responds to events
-	onEvent(pView, pInput, pValue, pHTMLSelector, pEvent)
+	/**
+	 * This input extension only responds to events
+	 *
+	 * @param {Object} pView - The view object.
+	 * @param {Object} pInput - The input object.
+	 * @param {any} pValue - The value from AppData.
+	 * @param {string} pHTMLSelector - The HTML selector.
+	 * @param {string} pEvent - The event hash that is expected to be triggered.
+	 * @param {string} pTransactionGUID - The transaction GUID, if any.
+	 * @returns {boolean} - Returns true.
+	 */
+	onAfterEventCompletion(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID)
 	{
-		const tmpPayload = typeof pValue === 'string' ? pEvent : '';
+		const tmpPayload = typeof pEvent === 'string' ? pEvent : '';
 		let [ tmpType, tmpGroupHash, tmpEvent, tmpInputHash, tmpEventGUID ] = tmpPayload.split(':');
 		if (!tmpEventGUID)
 		{
@@ -172,7 +188,7 @@ class CustomInputHandler extends libPictSectionInputExtension
 		let tmpAutoFillTriggerGroups = pInput.PictForm.AutofillTriggerGroup;
 		if (!tmpAutoFillTriggerGroups || tmpType !== 'TriggerGroup' || (pInput.Hash || pInput.DataAddress) == tmpInputHash)
 		{
-			return super.onEvent(pView, pInput, pValue, pHTMLSelector, pEvent);			
+			return super.onAfterEventCompletion(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID);
 		}
 		if (!Array.isArray(tmpAutoFillTriggerGroups))
 		{
@@ -204,12 +220,24 @@ class CustomInputHandler extends libPictSectionInputExtension
 			}
 		}
 
-		return super.onEvent(pView, pInput, pValue, pHTMLSelector, pEvent);
+		return super.onAfterEventCompletion(pView, pInput, pValue, pHTMLSelector, pEvent, pTransactionGUID);
 	}
 
-	onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent)
+	/**
+	 * Handles events for the Pict-Provider-InputExtension.
+	 *
+	 * @param {Object} pView - The view object.
+	 * @param {Object} pInput - The input object.
+	 * @param {any} pValue - The value from AppData.
+	 * @param {string} pHTMLSelector - The HTML selector.
+	 * @param {number} pRowIndex - The row index of the tabular data.
+	 * @param {string} pEvent - The event hash that is expected to be triggered.
+	 * @param {string} pTransactionGUID - The transaction GUID, if any.
+	 * @returns {boolean} - Returns true.
+	 */
+	onAfterEventTabularCompletion(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent, pTransactionGUID)
 	{
-		const tmpPayload = typeof pValue === 'string' ? pEvent : '';
+		const tmpPayload = typeof pEvent === 'string' ? pEvent : '';
 		let [ tmpType, tmpGroupHash, tmpEvent, tmpInputHash, tmpEventGUID ] = tmpPayload.split(':');
 		if (!tmpEventGUID)
 		{
@@ -219,7 +247,7 @@ class CustomInputHandler extends libPictSectionInputExtension
 		if (!pInput.PictForm.AutofillTriggerGroup || tmpType !== 'TriggerGroup' || (pInput.Hash || pInput.DataAddress) == tmpInputHash)
 		{
 			// Do nothing for now -- this is the triggering element
-			return super.onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent);
+			return super.onAfterEventTabularCompletion(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent, pTransactionGUID);
 		}
 		let tmpAutoFillTriggerGroups = pInput.PictForm.AutofillTriggerGroup;
 		if (!Array.isArray(tmpAutoFillTriggerGroups))
@@ -254,7 +282,7 @@ class CustomInputHandler extends libPictSectionInputExtension
 			}
 		}
 
-		return super.onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent);
+		return super.onAfterEventTabularCompletion(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent, pTransactionGUID);
 	}
 }
 

package/source/providers/inputs/Pict-Provider-Input-DateTime.js

@@ -63,12 +63,13 @@ class CustomInputHandler extends libPictSectionInputExtension
 	 * @param {Object} pInput - The input object.
 	 * @param {any} pValue - The value to be assigned.
 	 * @param {string} pHTMLSelector - The HTML selector.
+	 * @param {string} pTransactionGUID - The transaction GUID for the event dispatch.
 	 * @returns {any} - The result of the super method call.
 	 */
-	onDataMarshalToForm(pView, pGroup, pRow, pInput, pValue, pHTMLSelector)
+	onDataMarshalToForm(pView, pGroup, pRow, pInput, pValue, pHTMLSelector, pTransactionGUID)
 	{
 		this.pict.ContentAssignment.assignContent(this.getDateTimeInputHTMLID(pInput.Macro.RawHTMLID), pValue);
-		return super.onDataMarshalToForm(pView, pGroup, pRow, pInput, pValue, pHTMLSelector);
+		return super.onDataMarshalToForm(pView, pGroup, pRow, pInput, pValue, pHTMLSelector, pTransactionGUID);
 	}
 
 	/**
@@ -80,12 +81,13 @@ class CustomInputHandler extends libPictSectionInputExtension
 	 * @param {any} pValue - The value to be assigned.
 	 * @param {string} pHTMLSelector - The HTML selector.
 	 * @param {number} pRowIndex - The index of the row.
+	 * @param {string} pTransactionGUID - The transaction GUID for the event dispatch.
 	 * @returns {any} - The result of the data marshaling.
 	 */
-	onDataMarshalToFormTabular(pView, pGroup, pInput, pValue, pHTMLSelector, pRowIndex)
+	onDataMarshalToFormTabular(pView, pGroup, pInput, pValue, pHTMLSelector, pRowIndex, pTransactionGUID)
 	{
 		this.pict.ContentAssignment.assignContent(this.getTabularDateTimeInputHTMLID(pInput.Macro.RawHTMLID, pRowIndex), pValue);
-		return super.onDataMarshalToFormTabular(pView, pGroup, pInput, pValue, pHTMLSelector, pRowIndex);
+		return super.onDataMarshalToFormTabular(pView, pGroup, pInput, pValue, pHTMLSelector, pRowIndex, pTransactionGUID);
 	}
 
 	/**