html select appendto using jquery issue

Question

I have a select box, say teamproj, which gets loaded with values initially from backend mysql db table. I have made it user editable, by having another select box, say teampool, with option to add and remove options into teamproj box, using buttons, there id being "movetoproj" and "movetopool"... the example is given below.

$('#movetoproj').click(function() {  
    return !$('#teampool option:selected').remove().appendTo('#teamproj');  
});

 $('#movetopool').click(function() {  
    return !$('#teamproj option:selected').remove().appendTo('#teampool');  
 }); 

After this, i need to pass the final list of options of "teamproj" into another php page, by post using teamproj name attr. The issue here is, whatever user have appended or removed, is getting passed, but the inital list of values which got loaded into teamproj box, gets ignored.

I am not really sure , since jquery only appends the options, but the existing options gets ignored. Any suggestion would be really helpful.

Answer 1

As you are only able to post the selected option from the new drop down, maybe you should have a hidden input that you use to populate the values as a comma delimited list or something like that.

The only other solution is to post the values using jquery $.post. This way you will be able to cycle through the selects and find what values their options have before allowing the jquery to submit the form with your own values.