HTML - Revision history

Rudolf@tygron.nl at 11:05, 25 February 2026

2026-02-25T11:05:15Z

← Older revision		Revision as of 11:05, 25 February 2026
Line 1:		Line 1:
	[[File:Tql_webinar.png\|link=https://www.tygron.com/nl/2019/05/22/tql-en-~~upgrades~~/]]		[[File:Tql_webinar.png\|link=https://www.tygron.com/nl/2019/05/22/tql-en-indicators/]]

	==HTML==		==HTML==

Rudolf@tygron.nl at 08:43, 10 January 2024

2024-01-10T08:43:02Z

← Older revision		Revision as of 08:43, 10 January 2024
Line 296:		Line 296:
	* Change the "attribute" attribute of each the inputs to the [[Attribute]] the end-user should be able to modify via this interface.		* Change the "attribute" attribute of each the inputs to the [[Attribute]] the end-user should be able to modify via this interface.
	* Add a description of the [[Attribute]]'s intent/effect to the leading text so the end-user knows more concretely what they are editing.		* Add a description of the [[Attribute]]'s intent/effect to the leading text so the end-user knows more concretely what they are editing.

			{{article end
			\|external=
			* https://www.w3schools.com/html/, a public resource with more information on all facets of HTML and related technologies.
			}}

Rudolf@tygron.nl: /* Form to set attribute for multiple areas */

2021-11-03T15:22:52Z

Form to set attribute for multiple areas

← Older revision		Revision as of 15:22, 3 November 2021
Line 273:		Line 273:
	var values = [];		var values = [];
	for (var input of $('.inputForm').find('input') ) {		for (var input of $('.inputForm').find('input') ) {
	if ( $(input).val() !=='' ) {		if ( $(input).val() !== <nowiki>''</nowiki> ) {
	ids.push( $(input).attr('data-area') );		ids.push( $(input).attr('data-area') );
	attributes.push( $(input).attr('data-attribute') );		attributes.push( $(input).attr('data-attribute') );

Rudolf@tygron.nl: /* Form to set attribute for multiple areas */

2021-11-03T15:05:04Z

Form to set attribute for multiple areas

← Older revision		Revision as of 15:05, 3 November 2021
Line 263:		Line 263:

	<input type='submit' onclick='fillForm()' value='Change attributes' />		<input type='submit' onclick='fillForm()' value='Change attributes' />
	<form>		</form>

	<script>		<script>

Rudolf@tygron.nl: /* Example HTML */

2021-07-28T13:37:58Z

Example HTML

← Older revision		Revision as of 13:37, 28 July 2021
Line 226:		Line 226:
	}}		}}

	To use this example effectively, it is recommended to create an [[Excel]] which outputs the HTML presented here, and then replaces the following by the desired information"		To use this example effectively, it is recommended to create an [[Excel]] which outputs the HTML presented here, and then replaces the following by the desired information:
	* Change <code><input type='hidden' name='0' value='0' /></code>, so that the value of 0 is replaced by the ID of the [[Global]] you wish to allow to change.		* Change <code><input type='hidden' name='0' value='0' /></code>, so that the value of 0 is replaced by the ID of the [[Global]] you wish to allow to change.
	* Change <code><input type='number' name='1' value=<nowiki>''</nowiki></code>, so that that global's current value is automatically inserted. This means the end-user will know what they are changing the value from.		* Change <code><input type='number' name='1' value=<nowiki>''</nowiki></code>, so that that global's current value is automatically inserted. This means the end-user will know what they are changing the value from.
Line 290:		Line 290:
	</div>		</div>
	}}		}}

			To use this example effectively, it is recommended to create an [[Excel]] which outputs the HTML presented here, and then replaces the following by the desired information:
			* Create multiple inputs using an [[x query]], rather than statically defining a fixed number.
			* Ensure the "area" attribute of each of the inputs is defined based on the x-query's output, so that each input relates to exactly one valid [[Area]].
			* Change the "attribute" attribute of each the inputs to the [[Attribute]] the end-user should be able to modify via this interface.
			* Add a description of the [[Attribute]]'s intent/effect to the leading text so the end-user knows more concretely what they are editing.

Rudolf@tygron.nl: /* Form to set 1 global */

2021-07-28T13:33:49Z

Form to set 1 global

← Older revision		Revision as of 13:33, 28 July 2021
Line 225:		Line 225:
	</div>		</div>
	}}		}}

			To use this example effectively, it is recommended to create an [[Excel]] which outputs the HTML presented here, and then replaces the following by the desired information"
			* Change <code><input type='hidden' name='0' value='0' /></code>, so that the value of 0 is replaced by the ID of the [[Global]] you wish to allow to change.
			* Change <code><input type='number' name='1' value=<nowiki>''</nowiki></code>, so that that global's current value is automatically inserted. This means the end-user will know what they are changing the value from.
			* Add the name of the global (or a description of its intent/effect) to the leading text so the end-user knows more concretely what they are editing.

	===Form to set attribute for multiple areas===		===Form to set attribute for multiple areas===

Rudolf@tygron.nl: /* Forms */

2021-07-28T13:25:27Z

Forms

@@ Line 84: / Line 84: @@
 ===Forms===
 HTML can also be used to create forms. Forms are a structure for data entry and submission, and can be used in combination with the {{software}} [[API]] to facilitate interactions and effect changes. Forms consist of:
 * A <code>&lt;form&gt;</code> element to contain and define everything
-* One or more <code>&lt;input&gt;</code> tags elements to define the individual parameters of the instruction you wish to enact
+* One or more <code>&lt;input&gt;</code> elements to define the individual parameters of the instruction you wish to enact
 * A <code>&lt;input type='submit'&gt;</code> element (with its type set to "submit"), to create a button to actually send the data
 ===Comments===

Rudolf@tygron.nl: /* Forms */

2021-07-28T13:13:04Z

Forms

← Older revision		Revision as of 13:13, 28 July 2021
Line 86:		Line 86:
	{{stub\|type=section}}		{{stub\|type=section}}
	HTML can also be used to create forms. Forms are a structure for data entry and submission, and can be used in combination with the {{software}} [[API]] to facilitate interactions and effect changes. Forms consist of:		HTML can also be used to create forms. Forms are a structure for data entry and submission, and can be used in combination with the {{software}} [[API]] to facilitate interactions and effect changes. Forms consist of:
	* A <form> element to contain and define everything		* A <code><form></code> element to contain and define everything
	* One or more <input> tags elements to define the individual parameters of the instruction you wish to enact		* One or more <code><input></code> tags elements to define the individual parameters of the instruction you wish to enact
	* A <input type='submit'> element (with its type set to "submit"), to create a button to actually send the data		* A <code><input type='submit'></code> element (with its type set to "submit"), to create a button to actually send the data

	===Comments===		===Comments===

Rudolf@tygron.nl: /* Form to set attribute for multiple areas */

2021-07-28T13:07:41Z

Form to set attribute for multiple areas

← Older revision		Revision as of 13:07, 28 July 2021
Line 217:		Line 217:

	Most of the form is hidden, so inspecting the html code is recommended, but the following is important to note:		Most of the form is hidden, so inspecting the html code is recommended, but the following is important to note:
	* The actual value input fields are actually not part of the HTML form itself. Instead, because the data needs to be structured in a particular way when it is sent, a small script will run to take all values the end-user has filled in and add it to the form when the end-user is ready.
	* The form itself defines an action to take. In this example specifically, the endpoint "areas_set_attributes" will set attribute values for multiple areas. This endpoint expects 3 parameters: an [[Area]] specified by [[ID]], the name of the [[Attribute]] to set, and the value to set that [[Area]]'s [[Attribute]] to. This endpoint can also process lists of each of those parameters, so multiple [[Area]]s and/or multiple values can be modified.		* The form itself defines an action to take. In this example specifically, the endpoint "areas_set_attributes" will set attribute values for multiple areas. This endpoint expects 3 parameters: an [[Area]] specified by [[ID]], the name of the [[Attribute]] to set, and the value to set that [[Area]]'s [[Attribute]] to. This endpoint can also process lists of each of those parameters, so multiple [[Area]]s and/or multiple values can be modified.
			* The actual value input fields are actually not part of the HTML form itself. Instead, because the data needs to be structured in a particular way when sending parameters for multiple changes, a small script will run to take all values the end-user has filled in and add it to the form when the end-user is ready.
	* There are multiple inputs of type "number", which the end-user can fill in. There is one input field per [[Area]] which the end-user can set. The input fields have some additional data to specify a specific [[Area]] by [[ID]], and to specify an [[Attribute]] to set.		* There are multiple inputs of type "number", which the end-user can fill in. There is one input field per [[Area]] which the end-user can set. The input fields have some additional data to specify a specific [[Area]] by [[ID]], and to specify an [[Attribute]] to set.
	* The "submit" button is part of the form, so that when the user clicks it the form is sent.		* The "submit" button is part of the form, so that when the user clicks it the form is sent.

Rudolf@tygron.nl: /* Form to set attribute for multiple areas */

2021-07-28T13:06:52Z

Form to set attribute for multiple areas

← Older revision		Revision as of 13:06, 28 July 2021
Line 218:		Line 218:
	Most of the form is hidden, so inspecting the html code is recommended, but the following is important to note:		Most of the form is hidden, so inspecting the html code is recommended, but the following is important to note:
	* The actual value input fields are actually not part of the HTML form itself. Instead, because the data needs to be structured in a particular way when it is sent, a small script will run to take all values the end-user has filled in and add it to the form when the end-user is ready.		* The actual value input fields are actually not part of the HTML form itself. Instead, because the data needs to be structured in a particular way when it is sent, a small script will run to take all values the end-user has filled in and add it to the form when the end-user is ready.
			* The form itself defines an action to take. In this example specifically, the endpoint "areas_set_attributes" will set attribute values for multiple areas. This endpoint expects 3 parameters: an [[Area]] specified by [[ID]], the name of the [[Attribute]] to set, and the value to set that [[Area]]'s [[Attribute]] to. This endpoint can also process lists of each of those parameters, so multiple [[Area]]s and/or multiple values can be modified.
	* The form itself defines an action to take. In this example specifically, the endpoint "areas_set_attributes" will set attribute values for multiple areas. This endpoint expects 3 parameters: an [[Area]] specified by [[ID]], the name of the [[Attribute]] to set, and the value to set that [[Area]]'s [[Attribute]] to.
	* There are multiple inputs of type "number", which the end-user can fill in. There is one input field per [[Area]] which the end-user can set. The input fields have some additional data to specify a specific [[Area]] by [[ID]], and to specify an [[Attribute]] to set.		* There are multiple inputs of type "number", which the end-user can fill in. There is one input field per [[Area]] which the end-user can set. The input fields have some additional data to specify a specific [[Area]] by [[ID]], and to specify an [[Attribute]] to set.
	* The "submit" button is part of the form, so that when the user clicks it the form is sent.		* The "submit" button is part of the form, so that when the user clicks it the form is sent.