Build a dropdown list based on Array (using Jelly script)

[Community Alums]

Hello, 

If you want to create your dropdown list based on a array, please check the example below:

HTML

<!-- Values for select dropdown list-->

<g:evaluate>
var methods = [
{ name: 'Option number 1', value: 'Opt1' },
{ name: 'Option Number 2', value: 'Opt2' },
{ name: 'Option Number 3', value: 'Opt3' }
];
</g:evaluate>


<!-- Step #1 - Create dropdown for process type-->

<div class="form-group">
<label for="inputdefault" class="col-sm-2 control-label">Workflow Type:</label>
<div class="col-sm-10">
<!-- Step #1 - Start Select-->
<select class="form-control-static" id="dropdownId" name="dropdownId"   onchange="toggle_visibility(this); return false;">  
<option value="" selected="selected">-- Select --</option>  
<j:forEach items="${methods}" var="jvar_choice" indexVar="jvar_choice_id">
<g:evaluate jelly="true">
var name = jelly.jvar_choice.name;  
var value = jelly.jvar_choice.value;  
</g:evaluate>
</j:forEach>  
</select>  

<!-- Step #1 - End Select-->
  <div class="help-block">
  <j:if test="${!empty(jvar_choice)}">
  <label for="help_method_selected" id="help_method_selected"></label>
  </j:if>
  </div>      
</div>
</div>

Client Script

getDrop = document.getElementById('dropdownId').value; process = trim(dropdownId);
console.log('var Demand Number: ' +getDrop);

Processing Script

var p_dropdown = request.getParameter('dropdownId');
// For debugging
gs.info("MyDebug -INFO- Received form value for process ->" + p_dropdown);
gs.log("MyDebug -INFO- Received form, value for process ->" + p_dropdown);

Hope you find this useful!