Jquery - Grab multiple selections' data in Jquery
<p>This originates from <a href="http://stackoverflow.com/questions/10904829/jquery-how-to-grab-specific-data-type-of-option-after-that-option-is-selected">my original question</a>. I'm expanding on it.</p>

<p>Html select options</p>

<pre><code>    &lt;select id="1d" name="camp" multiple="multiple"&gt;
    &lt;option data-url0="week_1" value="Week 1"&gt;30th July&lt;/option&gt;
    &lt;option data-url1="week_2" value="Week 2"&gt;6th August&lt;/option&gt;
    &lt;/select&gt;
    &lt;input type="hidden" name="camp_url0" id="1e"&gt;
    &lt;input type="hidden" name="camp_url1" id="1f"&gt;
</code></pre>

<p>Jquery script I'm struggling with.</p>

<pre><code>    $("#1d").on("change", function () {
    var url1 = $(this).children(":selected").data("url0");
    var url2 = $(this).children(":selected").data("url1");
    $("#1e").val(url0);
    $("#1f").val(url1);
});
</code></pre>

<p>This code works beautifully (maybe not the cleanest?), except for one important issue. Even though it is a multiple selector, whenever both options are selected, only one <code>option</code> is marked as <code>:selected</code> in DOM, meaning only one <code>data-url{row_id}</code> is being inputted. I need both, if both are selected.</p>

<p>I hope that makes sense. Thanks for your help.</p>
