Submit hidden fields with listbox items that have been moved using jQuery

Question

I have two list boxes that I can move items to and from using jQuery. A summary of the code follows:

<select multiple size="10" id="from">...</select>
<select multiple id="to" size="10" name="subitted array[]">...</select>

Some buttons that when clicked move the items from the above list boxes:

<a href="javascript:moveSelected('from', 'to')">&gt;</a>...
<a href="javascript:moveSelected('to', 'from')">&lt;</a> 
<a href="javascript:moveAll('to', 'from')" href="#">&lt;&lt;</a>

The jQuery functions:

function moveAll(from, to) {
    $('#'+from+' option').remove().appendTo('#'+to); 
}

function moveSelected(from, to) {
    $('#'+from+' option:selected').remove().appendTo('#'+to); 
}

I also have the following function that I call on submit:

<form name="selection" method="post" onSubmit="return selectAll()">... </form>

function selectAll() {
    $("select option").attr("selected","selected");
}

But this only returns by POST the values in the right list box. I would also like to submit other fields present in the form (eg hidden fields). How can I do this?

Many thanks.

Answer 1

If your dropdown lists are inside your form, you dotn need any special treatment, just submit your form and all fields inside it, will be send to your controller.

In JS:

$('#formId').submit();

In your html:

<button type="submit">Send</button>

Any of this 2 options would suit your problem, if i understand workgly your problem, please let me know.

Also you should remove this code "onSubmit="return selectAll()" and leave form submit work normally, will send all your data into the form