This is a tough one to create a subject for, but here are the details:

aa ab ae a ac ad

Move by Value
<–move | move–>

Move by Text
<–move | move–>

On the web application I develop on, there was a previous moveModule created and used that would grab the selection from a pulldown and move it over to another pulldown (this was used for dynamic adding and selecting if you don’t know what you could use this for). The issue was that if you moved a selection from one to the other, and then back, the selection would then NOT be put back in the right place but at the end of the pulldown box (this can be annoying if you have a pulldown list full of states or countries). This made the original function very simple and small since it only needed to add an option at the end, but left several users wondering where the option went especially on a very very long list.

The initial remedy was to check the values and then add and insert accordingly. This did the trick, only if the value and text matched. Sometimes the option value was substitued for an id number (useful with a SQL table), so if the id’s and text’s didn’t sync accordingly by number and alphabetical order, then you’d have a mismatch. So I developed two functions that would take the place according to which the programmer defines. One for Value and one for Text (moveModuleByValue & moveModuleByText).

In the example html file, if you view the source you’ll notice that i’ve mismatched option ‘ad’ to accurately see the differences in the two move methods. Try to move that option back and forth between the two move functions to see it work effectively.

I would have tried to make this just one function, but i was not able to figure out how to interchange the DOM of .text and .value flawlessly. If I have time to hack at it more i’ll figure it out, but this seems to do the job just fine for me.

Comments and suggestions are always welcome.

movemodule.html
movemodule.js