Template For Dynamic Parameter Change
The "Allow URL parameters" feature allows changing the PocketQuery macro parameters using GET parameters (see Using the PocketQuery Macro for more information). We also added the macro option "Use change params template" that displays a form to allow users to change the parameter values, but in the background uses the GET parameters. For experimenting purposes, we will now manually rebuild this form and insert it before the default template.
The default template HTML can be rendered in a custom template by calling $PocketQuery.template("default")
. Of course, you could as well add the complete code using the "Add default template" link, but we want to keep it short. Above the default template, we will add our HTML form. Our template will look like this:
<form method="get" class="aui pq-dynamic-parameter-form" action="">
#foreach($entry in $otherParameters.entrySet())
<input type="hidden" name="$entry.key" value="$entry.value" />
#end
<button type="submit" class="pq-change-button aui-button aui-style aui-button-primary">Change</button>
#foreach($entry in $pocketQueryParameters.entrySet())
<div>
<label for="pq_$entry.key">$entry.key</label>
<input class="text" type="text" id="pq_$entry.key" name="pq_$entry.key" value="$entry.value" />
</div>
#end
</form>
$PocketQuery.template("default")
Before checking the result, make sure you enable the "Load macro dynamically" option of the embedded macro. After that, result will look like this:
In the input fields, the user can now change the parameter values given to the macro. Clicking the Change button will result in a page reload with the new parameters set.
Continue with “Using Google Charts “