Product: Mingcedar Studio DESIGNER
Input: drafts, variables, template parameters and validated submission | Mingcedar Studio
Use six exercises to configure input modes, templates, dynamic targets and page parameters, then validate and submit a value.
<div class="manual-doc-article manual-doc-article-section"><h2 id="recipe-page-parameter-input">Tutorial: Input: drafts, variables, template parameters and validated submission</h2>
Use six exercises to configure input modes, templates, dynamic targets and page parameters, then validate and submit a value.
<div class="doc-card-list doc-tutorial">
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-1">Preparation and sequence</h3>
<p>Install and authorize the add-in and confirm that you can open an exported screen in Mingcedar. Modify one page through sections 1–3, create separate pages for sections 4 and 5, and copy section 5’s page for section 6. Sections 1–2 need no PLC; section 3 onwards requires readable and writable numeric Tags.</p>
<p class="doc-table-hint">Scroll horizontally to view the full table</p>
<div class="doc-table-scroll" role="region" aria-label="Preparation and sequence" tabindex="0"><table class="doc-reference-table">
<thead><tr><th scope="col">Use case</th><th scope="col">Section</th><th scope="col">Data location</th></tr></thead><tbody>
<tr><th scope="row">Type first, read it on a button click</th><td>1 · Plain Input</td><td>This Input draft</td></tr>
<tr><th scope="row">Update text elsewhere on the same page</th><td>2 · Runtime Variable</td><td>A current-page variable</td></tr>
<tr><th scope="row">Edit one fixed pump</th><td>3 · PLC Tag</td><td>The selected device Tag</td></tr>
<tr><th scope="row">Reuse one Input design for two pumps</th><td>4 · <PLC> / <PUMP></td><td>Each template instance</td></tr>
<tr><th scope="row">Switch pumps without leaving the page</th><td>5 · =selectedSetpointTag</td><td>The runtime selection</td></tr>
<tr><th scope="row">Open a device from another page and validate a write</th><td>6 · Parameters + External</td><td>Destination draft and submit button</td></tr>
</tbody></table></div>
<ol>
<li>Choose Save after editing a template or behavior, then save the presentation.</li>
<li>After completing each section, update the screen package through MX Design → Export → Export HTML, reopen its page in Mingcedar and verify the result. Section 6 requires both the entry and destination pages in the export.</li>
</ol>
<ul class="doc-related-links">
<li><a href="/en/ppt/manual/windows-install/">Installation and authorization</a></li>
<li><a href="/en/ppt/manual/export-and-publish-screen-package/">Export and publish the screen package</a></li>
</ul>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-2">1A · Plain Input: create two independent inputs</h3>
<p>Create a blank PowerPoint slide with two Inputs, two display text boxes and a button. Reuse the insertion, naming and Edit Instance procedures below in later sections.</p>
<p class="doc-table-hint">Scroll horizontally to view the full table</p>
<div class="doc-table-scroll" role="region" aria-label="1A · Plain Input: create two independent inputs" tabindex="0"><table class="doc-reference-table">
<thead><tr><th scope="col">Location</th><th scope="col">Speed A</th><th scope="col">Speed B</th></tr></thead><tbody>
<tr><th scope="row">Edit Instance → Input mode</th><td>Plain Input</td><td>Plain Input</td></tr>
<tr><th scope="row">Target field</th><td>Hidden in Plain Input</td><td>Hidden in Plain Input</td></tr>
<tr><th scope="row">Type on the runtime page</th><td>1200</td><td>900</td></tr>
</tbody></table></div>
<ol>
<li>Open MX Design → Templates → Library, select the Input card and choose Insert template. Repeat to create a second Input.</li>
<li>Open MX Design → Behaviors → Browse. In the Behavior Browser component tree, right-click each Input root, choose Rename Component and name them Speed A and Speed B. Name the roots rather than their child shapes.</li>
<li>Use PowerPoint Insert → Text Box to add two text boxes, each containing a dash. Use Rename Component to name them Preview A and Preview B. Add a rectangle through Insert → Shapes and label it Show input.</li>
<li>Select the complete Speed A instance, open MX Design → Templates → Edit Instance, apply the settings below and choose Save. Repeat for Speed B.</li>
</ol>
<div class="doc-step-troubleshooting"><p><strong>If the result differs</strong></p><ul>
<li>Component names must match the script and be unique on the page. Speed A and Speed B are instance names, not device Tags.</li>
</ul></div>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-3">1B · Display the input on a button click</h3>
<p>Drag Click Script onto Show input in Behavior Browser. Open the binding, replace its code with the block below and save. Reuse this procedure for later buttons. Export, enter 1200 and 900, then click Show input.</p>
<div class="manual-code" data-code-language="javascript"><div class="manual-code-toolbar"><span>Click Script → Show input button</span><span class="manual-code-tools"><small>JavaScript</small><button type="button" data-copy-code data-copied="Copied" data-failed="Select and copy the code" aria-label="Copy code: Click Script → Show input button">Copy code</button><span class="manual-code-status" role="status"></span></span></div><pre tabindex="0" class="docs-code-block shiki github-light" style="background-color:#fff;color:#24292e" tabindex="0"><code><span class="line"><span style="color:#24292E">hqVisuDesigner.</span><span style="color:#6F42C1">setComponentText</span><span style="color:#24292E">(</span><span style="color:#032F62">"Preview A"</span><span style="color:#24292E">, template.</span><span style="color:#6F42C1">getValue</span><span style="color:#24292E">(</span><span style="color:#032F62">"Speed A"</span><span style="color:#24292E">));</span></span>
<span class="line"><span style="color:#24292E">hqVisuDesigner.</span><span style="color:#6F42C1">setComponentText</span><span style="color:#24292E">(</span><span style="color:#032F62">"Preview B"</span><span style="color:#24292E">, template.</span><span style="color:#6F42C1">getValue</span><span style="color:#24292E">(</span><span style="color:#032F62">"Speed B"</span><span style="color:#24292E">));</span></span></code></pre></div>
<p class="doc-step-result"><strong>Expected result</strong> Preview A displays 1200 and Preview B displays 900. Change Speed A and click again; only Preview A changes.</p>
<div class="doc-step-troubleshooting"><p><strong>If the result differs</strong></p><ul>
<li>If an Input is not found, check its root instance name. template.getValue reads current text without submitting it or preserving it across pages.</li>
</ul></div>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-4">2A · Runtime Variable: bind page variables</h3>
<p>Reuse Speed A and Speed B. Open MX Design → Scripts → Page Script, choose New, enter input-data in Name and paste this block into Code. Select Enabled and choose Save. Open Edit Instance for each Input, apply the settings below and save.</p>
<p class="doc-table-hint">Scroll horizontally to view the full table</p>
<div class="doc-table-scroll" role="region" aria-label="2A · Runtime Variable: bind page variables" tabindex="0"><table class="doc-reference-table">
<thead><tr><th scope="col">Field</th><th scope="col">Speed A</th><th scope="col">Speed B</th></tr></thead><tbody>
<tr><th scope="row">Input mode</th><td>Runtime Variable</td><td>Runtime Variable</td></tr>
<tr><th scope="row">Variable</th><td>speedDraftA</td><td>speedDraftB</td></tr>
<tr><th scope="row">Write trigger</th><td>Immediate</td><td>Immediate</td></tr>
</tbody></table></div>
<ul>
<li>Enter unquoted variable names in Variable. Input detects the submitted type: 1200 is an integer; entering "1200" including its double quotes submits a string.</li>
</ul>
<div class="manual-code" data-code-language="javascript"><div class="manual-code-toolbar"><span>Page Script → input-data</span><span class="manual-code-tools"><small>JavaScript</small><button type="button" data-copy-code data-copied="Copied" data-failed="Select and copy the code" aria-label="Copy code: Page Script → input-data">Copy code</button><span class="manual-code-status" role="status"></span></span></div><pre tabindex="0" class="docs-code-block shiki github-light" style="background-color:#fff;color:#24292e" tabindex="0"><code><span class="line"><span style="color:#D73A49">var</span><span style="color:#24292E"> speedDraftA </span><span style="color:#D73A49">=</span><span style="color:#005CC5"> 0</span><span style="color:#24292E">;</span></span>
<span class="line"><span style="color:#D73A49">var</span><span style="color:#24292E"> speedDraftB </span><span style="color:#D73A49">=</span><span style="color:#005CC5"> 0</span><span style="color:#24292E">;</span></span></code></pre></div>
<p class="doc-step-result"><strong>Expected result</strong> After exporting again, both Inputs start at 0. Enter 1200 or 900, then press Enter or leave the input to update its page variable.</p>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-5">2B · Display the page variables</h3>
<p>Delete Show input. Bind Script Text to Preview A, clear Setup Script, use the expression below in Display Text, set Condition to true and save. Repeat for Preview B with String(speedDraftB).</p>
<div class="manual-code" data-code-language="javascript"><div class="manual-code-toolbar"><span>Script Text → Preview A → Display Text</span><span class="manual-code-tools"><small>JavaScript</small><button type="button" data-copy-code data-copied="Copied" data-failed="Select and copy the code" aria-label="Copy code: Script Text → Preview A → Display Text">Copy code</button><span class="manual-code-status" role="status"></span></span></div><pre tabindex="0" class="docs-code-block shiki github-light" style="background-color:#fff;color:#24292e" tabindex="0"><code><span class="line"><span style="color:#6F42C1">String</span><span style="color:#24292E">(speedDraftA)</span></span></code></pre></div>
<p class="doc-step-result"><strong>Expected result</strong> After exporting again, committing Speed A updates Preview A, while Speed B updates Preview B. Reopening the page runs Page Script and restores both variables to 0.</p>
<div class="doc-step-troubleshooting"><p><strong>If the result differs</strong></p><ul>
<li>Clear the default example Tag read from Setup Script. Immediate commits edited content on Enter or when leaving the input, not on every keystroke.</li>
</ul></div>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-6">3 · PLC Tag: bind fixed devices</h3>
<p>Delete both Preview text boxes. Prepare the two Tags below with read/write access, decimal support, good quality and distinct current values. Open Edit Instance for Speed A and Speed B, apply the settings below and save. The input-data variables from section 2 may remain but are no longer used.</p>
<p class="doc-table-hint">Scroll horizontally to view the full table</p>
<div class="doc-table-scroll" role="region" aria-label="3 · PLC Tag: bind fixed devices" tabindex="0"><table class="doc-reference-table">
<thead><tr><th scope="col">Field</th><th scope="col">Speed A</th><th scope="col">Speed B</th></tr></thead><tbody>
<tr><th scope="row">Input mode</th><td>PLC Tag</td><td>PLC Tag</td></tr>
<tr><th scope="row">PLC Tag</th><td>PLC_LINE01.PUMP01.SPEED_SETPOINT</td><td>PLC_LINE01.PUMP02.SPEED_SETPOINT</td></tr>
<tr><th scope="row">Write trigger</th><td>Immediate</td><td>Immediate</td></tr>
</tbody></table></div>
<p class="doc-step-result"><strong>Expected result</strong> After exporting, each Input displays its own Tag value. Change only Speed A and press Enter. Verify PUMP01 Tag readback in Mingcedar; PUMP02 should retain its value.</p>
<div class="doc-step-troubleshooting"><p><strong>If the result differs</strong></p><ul>
<li>Enter the full address in PLC Tag, not a ReadTag or WriteTag call. For an unavailable Input, check the address, quality and permissions. Section 6 adds business range validation.</li>
</ul></div>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-7">4 · Template parameters: reuse an Input</h3>
<p>Reuse the two Tags from section 3 and create a reusable template on a new page.</p>
<p class="doc-table-hint">Scroll horizontally to view the full table</p>
<div class="doc-table-scroll" role="region" aria-label="4 · Template parameters: reuse an Input" tabindex="0"><table class="doc-reference-table">
<thead><tr><th scope="col">Template variables</th><th scope="col">First instance</th><th scope="col">Second instance</th></tr></thead><tbody>
<tr><th scope="row">PLC</th><td>PLC_LINE01</td><td>PLC_LINE01</td></tr>
<tr><th scope="row">PUMP</th><td>PUMP01</td><td>PUMP02</td></tr>
<tr><th scope="row">Resolved target</th><td>PLC_LINE01.PUMP01.SPEED_SETPOINT</td><td>PLC_LINE01.PUMP02.SPEED_SETPOINT</td></tr>
</tbody></table></div>
<ol>
<li>Create a blank slide and insert one Input from Templates → Library. Open Edit Instance, set Input mode to PLC Tag, enter <PLC>.<PUMP>.SPEED_SETPOINT in PLC Tag, set Write trigger to Immediate and choose Save.</li>
<li>Select the complete Input and open Templates → Library → Save selection. Set Template name to Pump setpoint input, retain the default Group, confirm PLC and PUMP in Captured variables and choose Save. Use another unique name if this one exists.</li>
<li>Close the library and delete the original Input that still contains placeholders from the page. Reopen Library, select the saved template and choose Insert template twice.</li>
<li>Select each new instance root, open Edit Instance and enter the template values below without quotes or angle brackets. Choose Save for each, save the presentation and export again.</li>
</ol>
<p class="doc-step-result"><strong>Expected result</strong> The two instances display different pumps. Changing the second instance’s PUMP does not change the first.</p>
<div class="doc-step-troubleshooting"><p><strong>If the result differs</strong></p><ul>
<li>PLC and PUMP configure each instance; they do not create page variables. If they were not captured, check that the original Input PLC Tag field contains <PLC> and <PUMP>.</li>
</ul></div>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-8">5A · Runtime target: configure an address variable</h3>
<p>Create a page and insert Input as in 1A; name its root Speed input. Create Page Script document input-data, paste the block below, enable and save it. Configure Edit Instance as shown.</p>
<p class="doc-table-hint">Scroll horizontally to view the full table</p>
<div class="doc-table-scroll" role="region" aria-label="5A · Runtime target: configure an address variable" tabindex="0"><table class="doc-reference-table">
<thead><tr><th scope="col">Template Edit field</th><th scope="col">Enter</th></tr></thead><tbody>
<tr><th scope="row">Input mode</th><td>PLC Tag</td></tr>
<tr><th scope="row">PLC Tag</th><td>=selectedSetpointTag</td></tr>
<tr><th scope="row">Write trigger</th><td>Immediate</td></tr>
</tbody></table></div>
<ul>
<li>HQVISU_DECLARE_TAGS declares the two Tags that this dynamic target may read and write. Host permissions still control access.</li>
</ul>
<div class="manual-code" data-code-language="javascript"><div class="manual-code-toolbar"><span>Page Script → Section 5 page → input-data</span><span class="manual-code-tools"><small>JavaScript</small><button type="button" data-copy-code data-copied="Copied" data-failed="Select and copy the code" aria-label="Copy code: Page Script → Section 5 page → input-data">Copy code</button><span class="manual-code-status" role="status"></span></span></div><pre tabindex="0" class="docs-code-block shiki github-light" style="background-color:#fff;color:#24292e" tabindex="0"><code><span class="line"><span style="color:#D73A49">var</span><span style="color:#24292E"> selectedSetpointTag </span><span style="color:#D73A49">=</span><span style="color:#032F62"> "PLC_LINE01.PUMP01.SPEED_SETPOINT"</span><span style="color:#24292E">;</span></span>
<span class="line"><span style="color:#6F42C1">HQVISU_DECLARE_TAGS</span><span style="color:#24292E">({</span></span>
<span class="line"><span style="color:#24292E"> expression: </span><span style="color:#032F62">"selectedSetpointTag"</span><span style="color:#24292E">,</span></span>
<span class="line"><span style="color:#24292E"> read: [</span><span style="color:#032F62">"PLC_LINE01.PUMP01.SPEED_SETPOINT"</span><span style="color:#24292E">, </span><span style="color:#032F62">"PLC_LINE01.PUMP02.SPEED_SETPOINT"</span><span style="color:#24292E">],</span></span>
<span class="line"><span style="color:#24292E"> write: [</span><span style="color:#032F62">"PLC_LINE01.PUMP01.SPEED_SETPOINT"</span><span style="color:#24292E">, </span><span style="color:#032F62">"PLC_LINE01.PUMP02.SPEED_SETPOINT"</span><span style="color:#24292E">]</span></span>
<span class="line"><span style="color:#24292E">});</span></span></code></pre></div>
<div class="doc-step-troubleshooting"><p><strong>If the result differs</strong></p><ul>
<li>Keep the leading = in PLC Tag to read the address from selectedSetpointTag. The Page Script variable declaration does not use this prefix.</li>
</ul></div>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-9">5B · Switch the target with buttons</h3>
<p>Give Select pump 2 the Click Script below and save. Copy it as Select pump 1 and change PUMP02 to PUMP01 in the copied script.</p>
<div class="manual-code" data-code-language="javascript"><div class="manual-code-toolbar"><span>Click Script → Select pump 2 button</span><span class="manual-code-tools"><small>JavaScript</small><button type="button" data-copy-code data-copied="Copied" data-failed="Select and copy the code" aria-label="Copy code: Click Script → Select pump 2 button">Copy code</button><span class="manual-code-status" role="status"></span></span></div><pre tabindex="0" class="docs-code-block shiki github-light" style="background-color:#fff;color:#24292e" tabindex="0"><code><span class="line"><span style="color:#24292E">hqVisuDesigner.</span><span style="color:#6F42C1">writeVariable</span><span style="color:#24292E">(</span><span style="color:#032F62">"selectedSetpointTag"</span><span style="color:#24292E">, </span><span style="color:#032F62">"PLC_LINE01.PUMP02.SPEED_SETPOINT"</span><span style="color:#24292E">);</span></span></code></pre></div>
<p class="doc-step-result"><strong>Expected result</strong> After exporting again, Select pump 2 displays the current PUMP02 value and Select pump 1 displays PUMP01. Selection buttons do not write a device value.</p>
<div class="doc-step-troubleshooting"><p><strong>If the result differs</strong></p><ul>
<li>Switching targets clears the unsubmitted draft. Select a device before typing; switching does not change an already-sent write request.</li>
</ul></div>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-10">6A · Page parameters: create device entry buttons</h3>
<p>Copy the page from section 5. Open MX Design → Page → Nav Path, change the copy’s Page Code to pump_setpoint and save. Keep Speed input and input-data; remove the selection buttons. Create a separate entry slide with an Open PUMP02 button and bind the Click Script below as in section 1B. Copy it as Open PUMP01 and change PUMP02 to PUMP01 in the copied script.</p>
<div class="manual-code" data-code-language="javascript"><div class="manual-code-toolbar"><span>Click Script → Source-page PUMP02 button</span><span class="manual-code-tools"><small>JavaScript</small><button type="button" data-copy-code data-copied="Copied" data-failed="Select and copy the code" aria-label="Copy code: Click Script → Source-page PUMP02 button">Copy code</button><span class="manual-code-status" role="status"></span></span></div><pre tabindex="0" class="docs-code-block shiki github-light" style="background-color:#fff;color:#24292e" tabindex="0"><code><span class="line"><span style="color:#D73A49">return</span><span style="color:#24292E"> hqVisuDesigner.</span><span style="color:#6F42C1">openPage</span><span style="color:#24292E">(</span><span style="color:#032F62">"pump_setpoint"</span><span style="color:#24292E">, {</span></span>
<span class="line"><span style="color:#24292E"> parameters: [{ key: </span><span style="color:#032F62">"pump"</span><span style="color:#24292E">, value: </span><span style="color:#032F62">"PUMP02"</span><span style="color:#24292E"> }]</span></span>
<span class="line"><span style="color:#24292E">});</span></span></code></pre></div>
<p class="doc-step-result"><strong>Expected result</strong> Both entry buttons open the same destination page with different pump parameters. Complete sections 6B–6D before exporting the complete presentation containing both pages.</p>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-11">6B · Validate page parameters</h3>
<p>On pump_setpoint, replace the entire input-data document with this code and save; do not create duplicate variables. GetPageParameter returns text. Missing or unknown values stop this initialization.</p>
<div class="manual-code" data-code-language="javascript"><div class="manual-code-toolbar"><span>Page Script → pump_setpoint → input-data</span><span class="manual-code-tools"><small>JavaScript</small><button type="button" data-copy-code data-copied="Copied" data-failed="Select and copy the code" aria-label="Copy code: Page Script → pump_setpoint → input-data">Copy code</button><span class="manual-code-status" role="status"></span></span></div><pre tabindex="0" class="docs-code-block shiki github-light" style="background-color:#fff;color:#24292e" tabindex="0"><code><span class="line"><span style="color:#D73A49">var</span><span style="color:#24292E"> pumpCode </span><span style="color:#D73A49">=</span><span style="color:#6F42C1"> GetPageParameter</span><span style="color:#24292E">(</span><span style="color:#032F62">"pump"</span><span style="color:#24292E">, </span><span style="color:#032F62">""</span><span style="color:#24292E">);</span></span>
<span class="line"><span style="color:#D73A49">if</span><span style="color:#24292E"> (pumpCode </span><span style="color:#D73A49">!==</span><span style="color:#032F62"> "PUMP01"</span><span style="color:#D73A49"> &&</span><span style="color:#24292E"> pumpCode </span><span style="color:#D73A49">!==</span><span style="color:#032F62"> "PUMP02"</span><span style="color:#24292E">) {</span></span>
<span class="line"><span style="color:#D73A49"> throw</span><span style="color:#D73A49"> new</span><span style="color:#6F42C1"> Error</span><span style="color:#24292E">(</span><span style="color:#032F62">"Open from a device entry; pump must be PUMP01 or PUMP02"</span><span style="color:#24292E">);</span></span>
<span class="line"><span style="color:#24292E">}</span></span>
<span class="line"><span style="color:#D73A49">var</span><span style="color:#24292E"> selectedSetpointTag </span><span style="color:#D73A49">=</span><span style="color:#032F62"> "PLC_LINE01."</span><span style="color:#D73A49"> +</span><span style="color:#24292E"> pumpCode </span><span style="color:#D73A49">+</span><span style="color:#032F62"> ".SPEED_SETPOINT"</span><span style="color:#24292E">;</span></span>
<span class="line"><span style="color:#6F42C1">HQVISU_DECLARE_TAGS</span><span style="color:#24292E">({</span></span>
<span class="line"><span style="color:#24292E"> expression: </span><span style="color:#032F62">"selectedSetpointTag"</span><span style="color:#24292E">,</span></span>
<span class="line"><span style="color:#24292E"> read: [</span><span style="color:#032F62">"PLC_LINE01.PUMP01.SPEED_SETPOINT"</span><span style="color:#24292E">, </span><span style="color:#032F62">"PLC_LINE01.PUMP02.SPEED_SETPOINT"</span><span style="color:#24292E">],</span></span>
<span class="line"><span style="color:#24292E"> write: [</span><span style="color:#032F62">"PLC_LINE01.PUMP01.SPEED_SETPOINT"</span><span style="color:#24292E">, </span><span style="color:#032F62">"PLC_LINE01.PUMP02.SPEED_SETPOINT"</span><span style="color:#24292E">]</span></span>
<span class="line"><span style="color:#24292E">});</span></span></code></pre></div>
<p class="doc-step-result"><strong>Expected result</strong> The PUMP01 and PUMP02 entries resolve selectedSetpointTag to their respective devices. PUMP99 or a missing pump parameter establishes no valid target.</p>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-12">6C · External: disable automatic input submission</h3>
<p>On pump_setpoint, select Speed input and open Edit Instance. Change Write trigger to External, retain Input mode PLC Tag and PLC Tag =selectedSetpointTag, then choose Save. Add a Submit rectangle button and a text box displaying Awaiting input. Use Rename Component to name the text box Input message.</p>
<p class="doc-table-hint">Scroll horizontally to view the full table</p>
<div class="doc-table-scroll" role="region" aria-label="6C · External: disable automatic input submission" tabindex="0"><table class="doc-reference-table">
<thead><tr><th scope="col">Object / field</th><th scope="col">This lesson</th></tr></thead><tbody>
<tr><th scope="row">Input instance name</th><td>Speed input</td></tr>
<tr><th scope="row">Input mode / PLC Tag</th><td>PLC Tag / =selectedSetpointTag</td></tr>
<tr><th scope="row">Write trigger</th><td>External</td></tr>
<tr><th scope="row">Feedback text shape name</th><td>Input message</td></tr>
</tbody></table></div>
<p class="doc-step-result"><strong>Expected result</strong> The Input displays the current device value. Editing and pressing Enter or leaving the input does not write automatically; the next section’s button submits the value.</p>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-13">6D · Validate and submit the value</h3>
<p>Save this Click Script on Submit. The example accepts decimal numbers from 0 to 3000; use the device’s permitted range in your project. Export the full package with Export HTML and select a device from the Mingcedar entry page.</p>
<div class="manual-code" data-code-language="javascript"><div class="manual-code-toolbar"><span>Click Script → Submit button</span><span class="manual-code-tools"><small>JavaScript</small><button type="button" data-copy-code data-copied="Copied" data-failed="Select and copy the code" aria-label="Copy code: Click Script → Submit button">Copy code</button><span class="manual-code-status" role="status"></span></span></div><pre tabindex="0" class="docs-code-block shiki github-light" style="background-color:#fff;color:#24292e" tabindex="0"><code><span class="line"><span style="color:#D73A49">var</span><span style="color:#24292E"> raw </span><span style="color:#D73A49">=</span><span style="color:#6F42C1"> String</span><span style="color:#24292E">(template.</span><span style="color:#6F42C1">getValue</span><span style="color:#24292E">(</span><span style="color:#032F62">"Speed input"</span><span style="color:#24292E">)).</span><span style="color:#6F42C1">trim</span><span style="color:#24292E">();</span></span>
<span class="line"><span style="color:#D73A49">var</span><span style="color:#24292E"> value </span><span style="color:#D73A49">=</span><span style="color:#6F42C1"> Number</span><span style="color:#24292E">(raw);</span></span>
<span class="line"><span style="color:#D73A49">if</span><span style="color:#24292E"> (</span><span style="color:#D73A49">!</span><span style="color:#032F62">/</span><span style="color:#D73A49">^</span><span style="color:#005CC5">[+-]</span><span style="color:#D73A49">?</span><span style="color:#032F62">(?:</span><span style="color:#005CC5">\d</span><span style="color:#D73A49">+</span><span style="color:#032F62">(?:</span><span style="color:#22863A;font-weight:bold">\.</span><span style="color:#005CC5">\d</span><span style="color:#D73A49">*</span><span style="color:#032F62">)</span><span style="color:#D73A49">?|</span><span style="color:#22863A;font-weight:bold">\.</span><span style="color:#005CC5">\d</span><span style="color:#D73A49">+</span><span style="color:#032F62">)</span><span style="color:#D73A49">$</span><span style="color:#032F62">/</span><span style="color:#24292E">.</span><span style="color:#6F42C1">test</span><span style="color:#24292E">(raw) </span><span style="color:#D73A49">||</span></span>
<span class="line"><span style="color:#D73A49"> !</span><span style="color:#24292E">Number.</span><span style="color:#6F42C1">isFinite</span><span style="color:#24292E">(value) </span><span style="color:#D73A49">||</span><span style="color:#24292E"> value </span><span style="color:#D73A49"><</span><span style="color:#005CC5"> 0</span><span style="color:#D73A49"> ||</span><span style="color:#24292E"> value </span><span style="color:#D73A49">></span><span style="color:#005CC5"> 3000</span><span style="color:#24292E">) {</span></span>
<span class="line"><span style="color:#24292E"> hqVisuDesigner.</span><span style="color:#6F42C1">setComponentText</span><span style="color:#24292E">(</span><span style="color:#032F62">"Input message"</span><span style="color:#24292E">, </span><span style="color:#032F62">"Enter a valid number from 0 to 3000"</span><span style="color:#24292E">);</span></span>
<span class="line"><span style="color:#D73A49"> return</span><span style="color:#005CC5"> false</span><span style="color:#24292E">;</span></span>
<span class="line"><span style="color:#24292E">}</span></span>
<span class="line"><span style="color:#24292E">hqVisuDesigner.</span><span style="color:#6F42C1">setComponentText</span><span style="color:#24292E">(</span><span style="color:#032F62">"Input message"</span><span style="color:#24292E">, </span><span style="color:#032F62">"Validation passed; check the device write result"</span><span style="color:#24292E">);</span></span>
<span class="line"><span style="color:#D73A49">return</span><span style="color:#6F42C1"> WriteTagDouble</span><span style="color:#24292E">(selectedSetpointTag, value);</span></span></code></pre></div>
<p class="doc-step-result"><strong>Expected result</strong> Entering 1200.5 and clicking Submit sends one write to the selected device. Blank text, letters, -1 and 3001 only show feedback without writing. Verify the applied value through Tag readback.</p>
<div class="doc-step-troubleshooting"><p><strong>If the result differs</strong></p><ul>
<li>template.getValue returns text, and Number("") equals 0. The code therefore checks both text format and numeric range.</li>
<li>This button performs the range check. Input has no separate minimum/maximum setting. Even with External selected, Keypad OK submits directly without calling this script. Do not connect a Keypad to Speed input in this example.</li>
</ul></div>
</article>
<article class="doc-card">
<h3 id="recipe-page-parameter-input-item-14">Verify the result</h3>
<p>Press Escape to discard unsubmitted input. A validation-passed message only confirms that the value meets the script’s rules; verify the write result separately.</p>
<ol>
<li>Open through PUMP01 and PUMP02 separately. Verify the displayed value and the Tag receiving each submitted write.</li>
<li>Enter 1200.5 and leave the input; confirm the device is unchanged. Click Submit and verify device readback.</li>
<li>Submit blank text, abc, -1 and 3001; confirm feedback without writes. Temporarily change the entry parameter to PUMP99 and confirm no valid binding is established, then restore the parameter.</li>
<li>Close and reopen the destination page; confirm that the Input displays the current device value again.</li>
</ol>
</article>
</div>
</div>