JSFiddle - React, Tailwind, and code Playground

by David Thomas

HTML

<select id="products" style="width: 110px">
    <option value="SRC[L]">SRC[L]</option>
</select>
<input type="hidden" value="12345" id="product_id_SRC[L]">
<input type="hidden" value="50" id="total_units_SRC[L]">
<button type="submit" id="create_suborder" class="button-primary" style="margin-top: 15px; float: right;">Generate Sub Orders</button>
<div id="result"></div>

JavaScript

jQuery('#create_suborder').click(function (event) {
    event.preventDefault();

    var product = jQuery('#products').val().replace(/\[|\]/g, function(a){
        return '\\' + a.charCodeAt(0).toString(16) + ' ';
    }),
        product_id = jQuery('#product_id_' + product).val(),
        total_units = jQuery('#total_units_' + product).val();

    jQuery('#result').html(product_id + ', ' + total_units);
});