Set and use variable after HTML select tag option selection

Developing Nodes
1

Hi,
I'm working on a new node and I have a question about a HTML <select> tag.
I need to set a variable based on which option is selected.

After this I need to use the value of this variable for show different <select> tag whit different option.

For example:

<script type="text/x-red" data-template-name="node">
        
    <div class="form-row">
        <label for="node-input-name"><i class="icon-tag"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
    <div class="form-row">
        <label for="node-input-unitId"><i class="icon-tag"></i> Unit ID</label>
        <input type="text" id="node-input-unitId" placeholder=" 123">
    </div>
    <div class="form-row">
        <label for="node-input-device"><i class="icon-tag"></i> Device</label>
        <select id="node-input-device" name="node-input-device">
           <option value="item1">ITEM 1</option>
           <option value="item2">ITEM 2</option>
        </select>
    </div>

If(node-input-device.value == item1):
          ```
          <div class="form-row">
       <label for="node-input-data"><i class="icon-list"></i> Values</label>
       <select id="node-input-data">
           <option value="a">A</option>
           <option value="b">B</option>
         ```
Else If(node-input-device.value == item2):
          ```
          <div class="form-row">
               <label for="node-input-data"><i class="icon-list"></i> Values</label>
               <select id="node-input-data">
                     <option value="c">C</option>
                     <option value="d">D</option>
               </select>
           </div>
</script>

Any suggestions?

Nicolò

2

jQuery is your friend here. It is available to you in the editor. You can dynamically select or even compose selects with it.

1 Like
3

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.