Option value in ISML - html

Question

I have a dropdown list (values populated from an object) from which the value selected goes on to the next page. However if that value is selected then another property of that object should go on to the next page.
My current code is:
<select name="ElementName" class="dropdown"
id="ElementsDropDownList">
<isloop iterator="ELEMENTS">
<option value="#ELEMENTS:ElementName#"><isprint
value="#ELEMENTS:ElementLabel#">
</option>
</isloop>
</select>
I want something like :
<select name="ElementName" class="dropdown"
id="ElementsDropDownList">
<isloop iterator="ELEMENTS">
<option value="#ELEMENTS:ElementName#"><isprint
value="#ELEMENTS:ElementLabel#">
</option>
<input type="Hidden" name="extraField" id="extraFieldUUID" value="<isprint
value="#ELEMENTS:ElementValue#">">
</isloop>
</select>
Here input field inside the loop is not working.

Answer 1

You can't have an input element inside of a select element. It would have to be separate:
<select name="ElementName" class="dropdown" id="ElementsDropDownList">
<isloop iterator="ELEMENTS">
<option value="#ELEMENTS:ElementName#">
<isprint value="#ELEMENTS:ElementLabel#">
</option>
</isloop>
</select>
<input type="Hidden" name="extraField" id="extraFieldUUID" value="<isprint value="#ELEMENTS:ElementValue#">">
However, clearly this won't work in your case because this is outside the loop. You'd need another loop, which means every ElementValue value would be included in the form. That's... no good.
It sounds like what you're trying to achieve is to have a select with two values. It doesn't really do that, pretty much by design. I can think of two options at the moment:
Include a hidden input outside the select element as shown above, but don't set a value for it. Include the list of possible values in JavaScript (as a hash table of some sort, most likely, using the ElementName as the key). Then attach an event handler to the select element's change event which sets the hidden input value based on the newly selected value.
Or, include both values in the select as delimited strings and parse them back out to separate values on the receiving page. Maybe something like:
(I'm completely guessing on the syntax, since I don't know anything about the templating tool you're using.) Then the code on the receiving page would receive some delimited string, something like:
"SomeElement|123"
That code would then need to parse that string into its two component values.