Setting select value on form submit with jQuery
<p>I'm trying to set a select value on submit, but I'm having some problems with declaring functions and the format of my code. Hopefully you guys can help out!</p>

<pre><code>&lt;form&gt;
   &lt;select&gt;
      &lt;option value="1" data-parent="-1"&gt;Alt 1&lt;/option&gt;
      &lt;option value="11" data-parent="1"&gt;&amp;nbsp;&amp;nbsp;Alt 1.1&lt;/option&gt;
      &lt;option value="12" data-parent="1"&gt;&amp;nbsp;&amp;nbsp;Alt 1.2/option&gt;
      &lt;option value="2" data-parent="-1"&gt;Alt 2&lt;/option&gt;
      &lt;option value="21" data-parent="2"&gt;&amp;nbsp;&amp;nbsp;Alt 2.1&lt;/option&gt;
      &lt;option value="22" data-parent="2"&gt;&amp;nbsp;&amp;nbsp;Alt 2.2&lt;/option&gt;
      &lt;option value="23" data-parent="2"&gt;&amp;nbsp;&amp;nbsp;Alt 2.3&lt;/option&gt;
      &lt;option value="24" data-parent="2"&gt;&amp;nbsp;&amp;nbsp;Alt 2.4option&gt;
      &lt;option value="3" data-parent="-1"&gt;Alt 3&lt;/option&gt;
      &lt;option value="31" data-parent="3"&gt;&amp;nbsp;&amp;nbsp;Alt 3.1&lt;/option&gt;
      &lt;option value="32" data-parent="3"&gt;&amp;nbsp;&amp;nbsp;Alt 3.2&lt;/option&gt;
   &lt;/select&gt;
   &lt;input type="submit" value="Submit"&gt;
&lt;/form&gt;

$('form select').on('change', function(e) {
  var optionSelected = $('option:selected', this);
  var selectedOptionParent = $('option:selected', this).attr('data-parent');

  var selectedValue = optionSelected.val();
  var parentValue = $('option[value="' + selectedOptionParent + '"]', this).val();

  var selectedValues = parentValue + ',' + selectedValue;
  console.log('Registered value is ' + parentValue + ',' + selectedValue);
});

$('form input[type="submit"]').on('click', function(e) {
  $('.modal-add-gallery-image select').val(selectedValues);
});
</code></pre>

<p>Please find example fiddle at <a href="https://jsfiddle.net/iamchriswick/sa6v7f6h/3/" rel="nofollow">https://jsfiddle.net/iamchriswick/sa6v7f6h/3/</a></p>