This question already has an answer here:
I have two small select boxes like this:
I added a small JS-functionality and attached them to the buttons, so I can move my left items to the right box, which works just fine.
However, after transferring them to the right box (which in my case is the box with the elements I want to insert in the DB afterwards), they are selected. Clicking on one of them deselects the other one. I want to have both of these options (which are generated dynamically) to be in my PHP-file.
This looks fine so far, but on a closer look, it doesn't work... which makes sense, since only one item is selected. Instead of taking only the selected items, I want all items of the right box.
My JavaScript for the transfer is this:
function move(leftValue, rightValue) {
var leftSelect = document.forms["myedit"].elements[leftValue];
var rightSelect = document.forms["myedit"].elements[rightValue];
if (leftSelect.selectedIndex == -1) {
window.alert("[{oxmultilang ident='TROEXTENDEDNEWS_SELECT_LEFT_FIRST'}]");
} else {
var option = leftSelect.options[leftSelect.selectedIndex];
rightSelect.appendChild(option);
}
}
pretty short. move left index to right index.
This is my HTML (left box):
<select class="editinput" name="editval[cats_available][]" multiple>
<option value="abc">abc</option>
<option value="def">def</option>
</selected>
This here is how I submit the form:
<input type="submit" name="save_new_cat" value="[{ oxmultilang ident='TROEXTENDEDNEWS_CREATE_NEW'}]" onClick="selectAllOptions('editval[cats_selected][]');document.myedit.fnc.value='createCategory'">
My question: What would be a good approach to have items in the post-request which are in the right box? Maybe before submitting the code a small JS-function which selects all items in the right box? Using a hidden field after clicking on the "move right" button? I'm kinda stuck here.
No jQuery available.
</div>