pict-section-form 1.0.21 → 1.0.23

package/example_applications/complex_table/Complex-Tabular-Application.js

@@ -45,7 +45,7 @@ module.exports.default_configuration.pict_configuration = {
 					{
 						//onclick="{~D:Record.Macro.DataRequestFunction~}"
 						"HashPostfix": "-Template-Wrap-Prefix",
-						"Template": "<h1>Rectangular Area Solver Micro-app</h1><div><a href=\"#\" onclick=\"_Pict.PictApplication.solve()\">[ solve ]</a></div><hr />"
+						"Template": "<h1>Rectangular Area Solver Micro-app</h1><div><a href=\"#\" onclick=\"{~Pict~}.PictApplication.solve()\">[ solve ]</a></div><hr />"
 					}
 				],
 

package/example_applications/manyfest_editor/html/index.html

@@ -47,8 +47,8 @@
 		<div id="navbarBasicExample" class="navbar-menu">
 			<div class="navbar-start">
 				<a class="navbar-item"> Overview </a>
-				<a class="navbar-item" href="#" onclick="_Pict.views['ManyfestCodeView'].render()"> Code </a>
-				<a class="navbar-item"> Descriptors </a>
+				<a class="navbar-item" href="#/Manyfest/Code"> Code </a>
+				<a class="navbar-item" href="#/Manyfest/Editor"> Descriptors </a>
 				<a class="navbar-item"> Sections </a>
 				<a class="navbar-item"> Reference Manifests </a>
 			</div>
@@ -71,7 +71,7 @@
 				</div>
 
 				<div class="buttons">
-					<a class="button is-primary" href="#" onclick="_Pict.providers.DataProvider.saveManyfest()"> <strong>Save</strong> </a>
+					<a class="button is-primary" href="#/Manyfest/Save"> <strong>Save</strong> </a>
 				</div>
 			</div>
 		</div>

package/example_applications/manyfest_editor/providers/Manyfest-Router.js

@@ -31,9 +31,16 @@ class ManyfestRouter extends libPictProvider
 		this.router.on('/Manyfest/Code',
 			(pData) =>
 			{
-				_Pict.views.ManyfestCodeView.render();
+				this.pict.views.ManyfestCodeView.render();
 			});
 
+		this.router.on('/Manyfest/Save',
+			(pData) =>
+			{
+				this.pict.providers.DataProvider.saveManyfest()
+			});
+		)
+
 		return super.onInitializeAsync(fCallback);
 	}
 }

package/example_applications/manyfest_editor/source/Manyfest-Editor.js

@@ -32,7 +32,7 @@ class ManyfestEditor extends libPictSectionForm.PictFormApplication
 	onAfterInitialize()
 	{
 		// Load the list of Manifests that have been saved.
-		_Pict.views.ManyfestLoadListView.render()
+		this.pict.views.ManyfestLoadListView.render()
 	}
 }
 

package/example_applications/manyfest_editor/views/Manyfest-Code-View.js

@@ -16,7 +16,7 @@ const _DEFAULT_VIEW_CONFIGURATION = (
 		<div class="container">
 			<h1 class="title">Manyfest Raw Code</h1>
 			<h2 class="subtitle">Your lens into the guts of this machine.</h2>
-			<textarea {~D:Record.Macro.InputFullProperties~} id="ManyfestRawCodeEditor" onchange="_Pict.views.ManyfestCodeView.marshalFromView()">{~D:Context[0].getManyfestRawCode()~}</textarea>
+			<textarea {~D:Record.Macro.InputFullProperties~} id="ManyfestRawCodeEditor" onchange="{~P~}.views.ManyfestCodeView.marshalFromView()">{~D:Context[0].getManyfestRawCode()~}</textarea>
 		</div>
 `
 		}

package/example_applications/manyfest_editor/views/Manyfest-LoadList-View.js

@@ -21,7 +21,7 @@ const _DEFAULT_VIEW_CONFIGURATION = (
 		{
 			Hash: "Manyfest-LoadList-Entry-Template",
 			Template: /*html*/`
-							<a class="navbar-item" href="#" onclick="_Pict.providers.DataProvider.loadManyfest('{~D:Record.Scope~}')"> {~D:Record.Scope~} </a>
+							<a class="navbar-item" href="#" onclick="{~P~}.providers.DataProvider.loadManyfest('{~D:Record.Scope~}')"> {~D:Record.Scope~} </a>
 `
 		},
 		{
@@ -33,7 +33,7 @@ const _DEFAULT_VIEW_CONFIGURATION = (
 		{
 			Hash: "Manyfest-DeleteList-Entry-Template",
 			Template: /*html*/`
-							<a class="navbar-item" href="#" onclick="_Pict.providers.DataProvider.removeScopeFromManyfestList('{~D:Record.Scope~}')"> {~D:Record.Scope~} </a>
+							<a class="navbar-item" href="#" onclick="{~P~}.providers.DataProvider.removeScopeFromManyfestList('{~D:Record.Scope~}')"> {~D:Record.Scope~} </a>
 `
 		},
 		{

package/example_applications/postcard_example/Pict-Application-Postcard.js

@@ -4,8 +4,11 @@ const libPictSectionForm = require('../../source/Pict-Section-Form.js');
 
 const libProviderDynamicSection = require('./providers/PictProvider-Dynamic-Sections.js');
 
+const libProviderInputExtension = require('./providers/PictProvider-PostKardInputExtension.js');
+
 const libMainApplicationView = require('./views/PictView-Postcard-MainApplication.js')
 
+
 class PostcardApplication extends libPictApplication
 {
 	constructor(pFable, pOptions, pServiceHash)
@@ -15,6 +18,8 @@ class PostcardApplication extends libPictApplication
 		this.pict.addProvider('Postcard-DynamicSection-Provider', libProviderDynamicSection.default_configuration, libProviderDynamicSection);
 		this.pict.addProvider('Postcard-Default-Theme-Provider', {}, require('./providers/PictProvider-BestPostcardTheme.js'));
 
+		this.pict.addProvider('PostKardInputExtension', libProviderInputExtension.default_configuration, libProviderInputExtension);
+
 		this.pict.addView('PostcardNavigation', require('./views/PictView-Postcard-Navigation.json'));
 		this.pict.addView('PostcardAbout', require('./views/PictView-Postcard-Content-About.json'));
 		this.pict.addView('PostcardLegal', require('./views/PictView-Postcard-Content-Legal.json'));
@@ -30,7 +35,7 @@ class PostcardApplication extends libPictApplication
 
 	changeToDefaultTheme()
 	{
-		this.pict.views.PictFormMetacontroller.formTemplatePrefix = _Pict.providers.PictFormSectionDefaultTemplateProvider.formsTemplateSetPrefix
+		this.pict.views.PictFormMetacontroller.formTemplatePrefix = this.pict.providers.PictFormSectionDefaultTemplateProvider.formsTemplateSetPrefix
 		// This generates the container metatemplates after we switch themes.
 		this.pict.views.PictFormMetacontroller.generateMetatemplate();
 		// This generates the view templates for each dynamic view generated from config.
@@ -45,7 +50,7 @@ class PostcardApplication extends libPictApplication
 
 	changeToPostcardTheme()
 	{
-		this.pict.views.PictFormMetacontroller.formTemplatePrefix = _Pict.providers['Postcard-Default-Theme-Provider'].formsTemplateSetPrefix;
+		this.pict.views.PictFormMetacontroller.formTemplatePrefix = this.pict.providers['Postcard-Default-Theme-Provider'].formsTemplateSetPrefix;
 		// This generates the container metatemplates after we switch themes.
 		this.pict.views.PictFormMetacontroller.generateMetatemplate();
 		// This generates the view templates for each dynamic view generated from config.
@@ -61,7 +66,7 @@ class PostcardApplication extends libPictApplication
 	onAfterInitializeAsync(fCallback)
 	{
 		// Default to the Pure theme
-		this.pict.views.PictFormMetacontroller.formTemplatePrefix = _Pict.providers['Postcard-Default-Theme-Provider'].formsTemplateSetPrefix;
+		this.pict.views.PictFormMetacontroller.formTemplatePrefix = this.pict.providers['Postcard-Default-Theme-Provider'].formsTemplateSetPrefix;
 
 		// Set a custom address for all the views to marshal to.
 		// This can also be set on specific views (same property)

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

@@ -106,6 +106,17 @@ Glug glug CUSTOMIZED glug Oo... -->
 				<textarea {~D:Record.Macro.HTMLID~} {~D:Record.Macro.InputFullProperties~} class="pure-u-23-24"></textarea>
             </div>
 
+	`
+			},
+			{
+				"HashPostfix": "-Template-Input-InputType-PostKardSignature",
+				"Template": /*HTML*/`
+            <div class="pure-u-1 pure-u-md-1-3">
+                <label {~D:Record.Macro.HTMLForID~}><em>{~D:Record.Name~}:</em></label>
+				<input type="text" {~D:Record.Macro.HTMLID~} {~D:Record.Macro.InputFullProperties~} class="pure-u-23-24" />
+				<a href="#" onclick="{~P~}.views['{~D:Context[0].Hash~}'].inputEvent('{~D:Record.Hash~}', 'BestEventEvarrrr')" class="pure-button">Sign</a>
+            </div>
+
 	`
 			}
 		]});

package/example_applications/postcard_example/providers/PictProvider-Dynamic-Sections-MockServerResponse.json

@@ -78,7 +78,7 @@
 					"Hash":"SignatureLine",
 					"Description":"How you would like your card signed.",
 					"DataType":"String"
-					,"PictForm": { "Section":"Postcard", "Group":"Content", "Row":4, "Width":12 }
+					,"PictForm": { "InputType":"PostKardSignature", "Section":"Postcard", "Group":"Content", "Row":4, "Width":12, "Providers": ["PostKardInputExtension"] }
 				},
 			"DeliveryDestination.StreetAddress1": 
 				{

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

@@ -0,0 +1,23 @@
+const libPictFormSection = require('../../../source/Pict-Section-Form.js');
+
+class CustomInputHandler extends libPictFormSection.PictInputExtensionProvider
+{
+	constructor(pFable, pOptions, pServiceHash)
+	{
+		super(pFable, pOptions, pServiceHash);
+	}
+
+	onEvent(pView, pInput, pValue, pHTMLSelector, pEvent)
+	{
+		console.log(`Alert alert event happened for ${pInput}: ${pEvent}`);
+		return super.onEvent(pView, pInput, pValue, pHTMLSelector, pEvent);
+	}
+
+	onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent)
+	{
+		console.log(`Alert alert event happened for ${pInput} row ${pRowIndex}: ${pEvent}`);
+		return super.onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent);
+	}
+}
+
+module.exports = CustomInputHandler;

package/example_applications/postcard_example/views/PictView-Postcard-Navigation.json

@@ -11,7 +11,7 @@
     "Templates": [
         {
             "Hash": "Postcard-Top-Navigation",
-            "Template": "<span class=\"pure-menu-heading\">Postkard</span><ul class=\"pure-menu-list\"><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"_Pict.views.PostcardMainApplication.render()\" class=\"pure-menu-link\">Send a Kard</a></li><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"_Pict.views.PostcardAbout.render()\" class=\"pure-menu-link\">About</a></li><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"_Pict.views.PostcardLegal.render()\" class=\"pure-menu-link\">Legal</a></li><li class=\"pure-menu-item menu-item-divided\"><a href=\"#\" onclick=\"_Pict.PictApplication.marshalDataFromViewToAppData()\" class=\"pure-menu-link\">Store Data</a></li><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"_Pict.PictApplication.marshalDataFromAppDataToView()\" class=\"pure-menu-link\">Read Data</a></li><li class=\"pure-menu-item menu-item-divided\"><a href=\"#\" onclick=\"_Pict.PictApplication.changeToPostcardTheme()\" class=\"pure-menu-link\">Postkard Pure CSS Theme</a></li><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"_Pict.PictApplication.changeToDefaultTheme()\" class=\"pure-menu-link\">Pict Raw HTML Form Theme</a></li></ul>"
+            "Template": "<span class=\"pure-menu-heading\">Postkard</span><ul class=\"pure-menu-list\"><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"{~P~}.views.PostcardMainApplication.render()\" class=\"pure-menu-link\">Send a Kard</a></li><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"{~P~}.views.PostcardAbout.render()\" class=\"pure-menu-link\">About</a></li><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"{~P~}.views.PostcardLegal.render()\" class=\"pure-menu-link\">Legal</a></li><li class=\"pure-menu-item menu-item-divided\"><a href=\"#\" onclick=\"{~P~}.PictApplication.marshalDataFromViewToAppData()\" class=\"pure-menu-link\">Store Data</a></li><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"{~P~}.PictApplication.marshalDataFromAppDataToView()\" class=\"pure-menu-link\">Read Data</a></li><li class=\"pure-menu-item menu-item-divided\"><a href=\"#\" onclick=\"{~P~}.PictApplication.changeToPostcardTheme()\" class=\"pure-menu-link\">Postkard Pure CSS Theme</a></li><li class=\"pure-menu-item\"><a href=\"#\" onclick=\"{~P~}.PictApplication.changeToDefaultTheme()\" class=\"pure-menu-link\">Pict Raw HTML Form Theme</a></li></ul>"
         }
     ],
     "Renderables": [

package/example_applications/simple_form/Simple-Form_Default_Manifest.json

@@ -18,7 +18,7 @@
 				[
 					{
 						"HashPostfix": "-Template-Wrap-Prefix",
-						"Template": "<h1>Rectangular Area Solver Micro-app</h1><div><a href=\"#\" onclick=\"_Pict.PictApplication.solve()\">[ solve ]</a></div><hr />"
+						"Template": "<h1>Rectangular Area Solver Micro-app</h1><div><a href=\"#\" onclick=\"{~P~}.PictApplication.solve()\">[ solve ]</a></div><hr />"
 					}
 				]
 		}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "pict-section-form",
-    "version": "1.0.21",
+    "version": "1.0.23",
     "description": "Pict dynamic form sections",
     "main": "source/Pict-Section-Form.js",
     "directories": {

package/source/providers/Pict-Provider-DynamicTemplates-DefaultFormTemplates-ReadOnly.js

@@ -195,9 +195,9 @@ Glug glug glug Oo... -->
 		{
 			"HashPostfix": "-TabularTemplate-Row-ExtraPostfix",
 			"Template": /*HTML*/`<!-- TabularTemplateRow-ExtraPostfix-->
-					<td><a href="#" onClick="_Pict.views['{~D:Context[0].Hash~}'].deleteDynamicTableRow({~D:Record.Group~},'{~D:Record.Key~}')">del</a>
-					<a href="#" onClick="_Pict.views['{~D:Context[0].Hash~}'].moveDynamicTableRowUp({~D:Record.Group~},'{~D:Record.Key~}')">up</a>
-					<a href="#" onClick="_Pict.views['{~D:Context[0].Hash~}'].moveDynamicTableRowDown({~D:Record.Group~},'{~D:Record.Key~}')">down</a></td>
+					<td><a href="#" onClick="{~P~}.views['{~D:Context[0].Hash~}'].deleteDynamicTableRow({~D:Record.Group~},'{~D:Record.Key~}')">del</a>
+					<a href="#" onClick="{~P~}.views['{~D:Context[0].Hash~}'].moveDynamicTableRowUp({~D:Record.Group~},'{~D:Record.Key~}')">up</a>
+					<a href="#" onClick="{~P~}.views['{~D:Context[0].Hash~}'].moveDynamicTableRowDown({~D:Record.Group~},'{~D:Record.Key~}')">down</a></td>
 `
 		},
 		/*
@@ -285,7 +285,7 @@ Glug glug glug Oo... -->
 		},
 		{
 			"HashPostfix": "-TabularTemplate-InformaryAddress-Input",
-			"Template": /*HTML*/` data-i-index="{~D:Context[2].Key~}" onchange="_Pict.views['{~D:Context[0].Hash~}'].dataChangedTabular('{~D:Context[2].Group~}', '{~D:Record.PictForm.InputIndex~}', '{~D:Context[2].Key~}')"  `
+			"Template": /*HTML*/` data-i-index="{~D:Context[2].Key~}" onchange="{~P~}.views['{~D:Context[0].Hash~}'].dataChangedTabular('{~D:Context[2].Group~}', '{~D:Record.PictForm.InputIndex~}', '{~D:Context[2].Key~}')"  `
 		},
 		/*
 		 * END Tabular Input Templates

package/source/providers/Pict-Provider-DynamicTemplates-DefaultFormTemplates.js

@@ -244,9 +244,9 @@ Glug glug glug Oo... -->
 		{
 			"HashPostfix": "-TabularTemplate-Row-ExtraPostfix",
 			"Template": /*HTML*/`<!-- TabularTemplateRow-ExtraPostfix-->
-					<td><a href="#" onClick="_Pict.views['{~D:Context[0].Hash~}'].deleteDynamicTableRow({~D:Record.Group~},'{~D:Record.Key~}')">del</a>
-					<a href="#" onClick="_Pict.views['{~D:Context[0].Hash~}'].moveDynamicTableRowUp({~D:Record.Group~},'{~D:Record.Key~}')">up</a>
-					<a href="#" onClick="_Pict.views['{~D:Context[0].Hash~}'].moveDynamicTableRowDown({~D:Record.Group~},'{~D:Record.Key~}')">down</a></td>
+					<td><a href="#" onClick="{~P~}.views['{~D:Context[0].Hash~}'].deleteDynamicTableRow({~D:Record.Group~},'{~D:Record.Key~}')">del</a>
+					<a href="#" onClick="{~P~}.views['{~D:Context[0].Hash~}'].moveDynamicTableRowUp({~D:Record.Group~},'{~D:Record.Key~}')">up</a>
+					<a href="#" onClick="{~P~}.views['{~D:Context[0].Hash~}'].moveDynamicTableRowDown({~D:Record.Group~},'{~D:Record.Key~}')">down</a></td>
 `
 		},
 		/*
@@ -334,7 +334,7 @@ Glug glug glug Oo... -->
 		},
 		{
 			"HashPostfix": "-TabularTemplate-InformaryAddress-Input",
-			"Template": /*HTML*/` data-i-index="{~D:Context[2].Key~}" onchange="_Pict.views['{~D:Context[0].Hash~}'].dataChangedTabular('{~D:Context[2].Group~}', '{~D:Record.PictForm.InputIndex~}', '{~D:Context[2].Key~}')"  `
+			"Template": /*HTML*/` data-i-index="{~D:Context[2].Key~}" onchange="{~P~}.views['{~D:Context[0].Hash~}'].dataChangedTabular('{~D:Context[2].Group~}', '{~D:Record.PictForm.InputIndex~}', '{~D:Context[2].Key~}')"  `
 		},
 
 		{
@@ -379,14 +379,14 @@ Glug glug glug Oo... -->
 		{
 			"HashPostfix": "-TabularTemplate-End-Input-InputType-Option",
 			"Template": /*HTML*/` value="">
-					<select id="SELECT-TABULAR-DROPDOWN-{~D:Record.Macro.RawHTMLID~}-{~D:Context[2].Key~}" onchange="_Pict.views['{~D:Context[0].Hash~}'].inputDataRequestTabular('{~D:Context[2].Group~}', '{~D:Record.PictForm.InputIndex~}', '{~D:Context[2].Key~}')"></select>
+					<select id="SELECT-TABULAR-DROPDOWN-{~D:Record.Macro.RawHTMLID~}-{~D:Context[2].Key~}" onchange="{~P~}.views['{~D:Context[0].Hash~}'].inputDataRequestTabular('{~D:Context[2].Group~}', '{~D:Record.PictForm.InputIndex~}', '{~D:Context[2].Key~}')"></select>
 `
 		},
 		{
 			"HashPostfix": "-TabularTemplate-Begin-Input-InputType-Boolean",
 			"Template": /*HTML*/`
 					<!-- InputType Boolean {~D:Record.Hash~} {~D:Record.DataType~} -->
-					<input type="checkbox"  {~D:Record.Macro.HTMLName~} {~D:Record.Macro.InformaryTabular~} `
+					<input type="checkbox" {~D:Record.Macro.HTMLName~} {~D:Record.Macro.InformaryTabular~} `
 		},
 		{
 			"HashPostfix": "-TabularTemplate-End-Input-InputType-Boolean",
@@ -402,14 +402,14 @@ Glug glug glug Oo... -->
 		{
 			"HashPostfix": "-TabularTemplate-End-Input-DataType-DateTime",
 			"Template": /*HTML*/` value="">
-					<input id="DATETIME-TABULAR-INPUT-{~D:Record.Macro.RawHTMLID~}-{~D:Context[2].Key~}" onchange="_Pict.views['{~D:Context[0].Hash~}'].inputDataRequestTabular('{~D:Context[2].Group~}', '{~D:Record.PictForm.InputIndex~}', '{~D:Context[2].Key~}')" type="datetime-local" value="" />
+					<input id="DATETIME-TABULAR-INPUT-{~D:Record.Macro.RawHTMLID~}-{~D:Context[2].Key~}" onchange="{~P~}.views['{~D:Context[0].Hash~}'].inputDataRequestTabular('{~D:Context[2].Group~}', '{~D:Record.PictForm.InputIndex~}', '{~D:Context[2].Key~}')" type="datetime-local" value="" />
 `
 		},
 		{
 			"HashPostfix": "-TabularTemplate-Begin-Input-InputType-Hidden",
 			"Template": /*HTML*/`
 					<!-- InputType Hidden {~D:Record.Hash~} {~D:Record.DataType~} -->
-					<input type="hidden" {~D:Record.Macro.InputFullProperties~} {~D:Record.Macro.InputChangeHandler~} 
+					<input type="hidden" {~D:Record.Macro.InputFullProperties~} {~D:Record.Macro.InputChangeHandler~} {~D:Record.Macro.InformaryTabular~}
 `
 		},
 		{

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

@@ -152,6 +152,38 @@ class PictInputExtensionProvider extends libPictProvider
 	{
 		return true;
 	}
+
+
+	/**
+	 * Handles events for the Pict-Provider-InputExtension.
+	 *
+	 * @param {Object} pView - The view object.
+	 * @param {Object} pInput - The input object.
+	 * @param {string} pValue - The value from AppData.
+	 * @param {string} pHTMLSelector - The HTML selector.
+	 * @param {string} pEvent - The event hash that is expected to be triggered.
+	 * @returns {boolean} - Returns true.
+	 */
+	onEvent(pView, pInput, pValue, pHTMLSelector, pEvent)
+	{
+		return true;
+	}
+
+	/**
+	 * Handles events for the Pict-Provider-InputExtension.
+	 *
+	 * @param {Object} pView - The view object.
+	 * @param {Object} pInput - The input object.
+	 * @param {string} 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.
+	 * @returns {boolean} - Returns true.
+	 */
+	onEventTabular(pView, pInput, pValue, pHTMLSelector, pRowIndex, pEvent)
+	{
+		return true;
+	}
 }
 
 module.exports = PictInputExtensionProvider;

package/source/views/Pict-View-DynamicForm-DefaultConfiguration.json

@@ -16,7 +16,7 @@
 		"Group": {
 			"HTMLID": " id=\"Group-{~D:Context[0].UUID~}\" ",
 
-			"TabularCreateRowFunctionCall": "_Pict.views['{~D:Context[0].Hash~}'].createDynamicTableRow({~D:Record.GroupIndex~})"
+			"TabularCreateRowFunctionCall": "{~P~}.views['{~D:Context[0].Hash~}'].createDynamicTableRow({~D:Record.GroupIndex~})"
 		},
 		"Input": {
 			"Informary": " data-i-form=\"{~D:Context[0].formID~}\" data-i-datum=\"{~D:Record.PictForm.InformaryDataAddress~}\" ",
@@ -33,9 +33,9 @@
 			"HTMLForID": " for=\"{~D:Context[0].UUID~}-FormInput-{~D:Record.Hash~}\" ",
 
 			"InputFullProperties": " data-i-form=\"{~D:Context[0].formID~}\" data-i-datum=\"{~D:Record.PictForm.InformaryDataAddress~}\"  name=\"{~D:Record.Name~}\" ",
-			"InputChangeHandler": " onchange=\"_Pict.views['{~D:Context[0].Hash~}'].dataChanged('{~D:Record.Hash~}')\" ",
+			"InputChangeHandler": " onchange=\"{~P~}.views['{~D:Context[0].Hash~}'].dataChanged('{~D:Record.Hash~}')\" ",
 
-			"DataRequestFunction": " _Pict.views['{~D:Context[0].Hash~}'].inputDataRequest('{~D:Record.Hash~}'); "
+			"DataRequestFunction": " {~P~}.views['{~D:Context[0].Hash~}'].inputDataRequest('{~D:Record.Hash~}'); "
 		}
 	},
 

package/source/views/Pict-View-DynamicForm.js

@@ -463,24 +463,6 @@ class PictViewDynamicForm extends libPictViewClass
 					tmpGroup.Rows = [];
 				}
 
-				if (tmpGroup.supportingManifest && (typeof(tmpGroup.RecordSetAddress) == 'string'))
-				{
-					let tmpSupportingManifestDescriptorKeys = Object.keys(tmpGroup.supportingManifest.elementDescriptors);
-					for (let k = 0; k < tmpSupportingManifestDescriptorKeys.length; k++)
-					{
-						let tmpInput = tmpGroup.supportingManifest.elementDescriptors[tmpSupportingManifestDescriptorKeys[k]];
-
-						if (!('PictForm' in tmpInput))
-						{
-							tmpInput.PictForm = {};
-						}
-
-						tmpInput.PictForm.InformaryDataAddress = tmpSupportingManifestDescriptorKeys[k];
-						tmpInput.PictForm.InformaryContainerAddress = tmpGroup.RecordSetAddress;
-						tmpInput.RowIdentifierTemplateHash = '{~D:Record.RowID~}';
-					}
-				}
-
 				let tmpRowHash = (typeof(tmpDescriptor.PictForm.Row) == 'string') ? tmpDescriptor.PictForm.Row :
 								(typeof(tmpDescriptor.PictForm.Row) == 'number') ? `Row_${tmpDescriptor.PictForm.Row.toString()}` :
 								'Row_Default';
@@ -534,6 +516,23 @@ class PictViewDynamicForm extends libPictViewClass
 					tmpGroup.supportingManifest = this.fable.instantiateServiceProviderWithoutRegistration('Manifest', this.options.Manifests.Section.ReferenceManifests[tmpGroup.RecordManifest]);
 				}
 			}
+			if (tmpGroup.supportingManifest && (typeof(tmpGroup.RecordSetAddress) == 'string'))
+			{
+				let tmpSupportingManifestDescriptorKeys = Object.keys(tmpGroup.supportingManifest.elementDescriptors);
+				for (let k = 0; k < tmpSupportingManifestDescriptorKeys.length; k++)
+				{
+					let tmpInput = tmpGroup.supportingManifest.elementDescriptors[tmpSupportingManifestDescriptorKeys[k]];
+
+					if (!('PictForm' in tmpInput))
+					{
+						tmpInput.PictForm = {};
+					}
+
+					tmpInput.PictForm.InformaryDataAddress = tmpSupportingManifestDescriptorKeys[k];
+					tmpInput.PictForm.InformaryContainerAddress = tmpGroup.RecordSetAddress;
+					tmpInput.RowIdentifierTemplateHash = '{~D:Record.RowID~}';
+				}
+			}
 		}
 
 	}
@@ -1245,6 +1244,42 @@ class PictViewDynamicForm extends libPictViewClass
 		}
 	}
 
+	inputEvent(pInputHash, pEvent)
+	{
+		let tmpInput = this.getInputFromHash(pInputHash);
+		if (pInputHash)
+		{
+			let tmpHashAddress = this.sectionManifest.resolveHashAddress(pInputHash);
+			try
+			{
+				let tmpMarshalDestinationObject = this.getMarshalDestinationObject();
+				if (tmpInput && tmpInput.PictForm && ('Providers' in tmpInput.PictForm) && Array.isArray(tmpInput.PictForm.Providers))
+				{
+					let tmpValue = this.sectionManifest.getValueByHash(tmpMarshalDestinationObject, tmpHashAddress);
+					for (let i = 0; i < tmpInput.PictForm.Providers.length; i++)
+					{
+						if (this.pict.providers[tmpInput.PictForm.Providers[i]])
+						{
+							this.pict.providers[tmpInput.PictForm.Providers[i]].onEvent(this, tmpInput, tmpValue, tmpInput.Macro.HTMLSelector, pEvent);
+						}
+						else
+						{
+							this.log.error(`Dynamic form [${this.Hash}]::[${this.UUID}] inputEvent ${pEvent} cannot find provider [${tmpInput.PictForm.Providers[i]}] for input [${tmpInput.Hash}].`);
+						}
+					}
+				}
+			}
+			catch (pError)
+			{
+				this.log.error(`Dynamic form [${this.Hash}]::[${this.UUID}] gross error running inputEvent ${pEvent} specific (${pInputHash}) data from view in dataChanged event: ${pError}`);
+			}
+		}
+		else
+		{
+			this.log.error(`Dynamic form [${this.Hash}]::[${this.UUID}] cannot find input hash [${pInputHash}] for inputEvent ${pEvent} event.`);
+		}
+	}
+
 	inputDataRequestTabular(pGroupIndex, pInputIndex, pRowIndex)
 	{
 		let tmpInput = this.getTabularRecordInput(pGroupIndex, pInputIndex);
@@ -1288,6 +1323,49 @@ class PictViewDynamicForm extends libPictViewClass
 		this.marshalToView();
 	}
 
+	inputEventTabular(pGroupIndex, pInputIndex, pRowIndex, pEvent)
+	{
+		let tmpInput = this.getTabularRecordInput(pGroupIndex, pInputIndex);
+		if (pGroupIndex && pInputIndex && pRowIndex && tmpInput)
+		{
+			try
+			{
+				let tmpMarshalDestinationObject = this.getMarshalDestinationObject();
+				if (tmpInput && tmpInput.PictForm && ('Providers' in tmpInput.PictForm) && Array.isArray(tmpInput.PictForm.Providers))
+				{
+					// TODO: Can we simplify this?
+					let tmpValueAddress = this.pict.providers.Informary.getComposedContainerAddress(tmpInput.PictForm.InformaryContainerAddress, pRowIndex, tmpInput.PictForm.InformaryDataAddress);
+					let tmpValue = this.sectionManifest.getValueByHash(tmpMarshalDestinationObject, tmpValueAddress);
+
+					let tmpVirtualInformaryHTMLSelector = tmpInput.Macro.HTMLSelectorTabular+`[data-i-index="${pRowIndex}"]`;
+					for (let i = 0; i < tmpInput.PictForm.Providers.length; i++)
+					{
+						if (this.pict.providers[tmpInput.PictForm.Providers[i]])
+						{
+							this.pict.providers[tmpInput.PictForm.Providers[i]].onEventTabular(this, tmpInput, tmpValue, tmpVirtualInformaryHTMLSelector, pRowIndex, pEvent);
+						}
+						else
+						{
+							this.log.error(`Dynamic form [${this.Hash}]::[${this.UUID}] cannot find provider [${tmpInput.PictForm.Providers[i]}] for input [${tmpInput.Hash}] row ${pRowIndex} calling inputEvent ${pEvent}.`);
+						}
+					}
+				}
+			}
+			catch (pError)
+			{
+				this.log.error(`Dynamic form [${this.Hash}]::[${this.UUID}] gross error marshaling specific (${pInputHash}) tabular data for group ${pGroupIndex} row ${pRowIndex} from view in calling inputEvent ${pEvent}: ${pError}`);
+			}
+		}
+		else
+		{
+			// This is what is called whenever a hash is changed.  We could marshal from view, solve and remarshal to view.
+			this.marshalFromView();
+		}
+		// Run any dynamic input providers for the input hash.
+		this.pict.PictApplication.solve();
+		this.marshalToView();
+	}
+
 	get isPictSectionForm()
 	{
 		return true;