How to add/remove items from one list box to another in the same form with php??

I have two list boxes on the same page. One is populated with items from a database table. I want to be able to select an item at a time, choose the quantity from a dropdown list, then click on a button 'Add' and transfer the selected item from list box 1 to list box 2 with the corresponding quantity. I want to be able to do this multiple times. Also, when the item is added from list box 1 to list box 2, it should disappear from list box 1 to prevent the user from choosing the same item more than once. Similarly, the user should be able to select an item from list box 2, click on button 'Remove' and move the item back to list box 1 while it disappears from list box 2. How do I do this?
Thank you,
A
aej1973Asked:
Who is Participating?
 
Richard QuadlingConnect With a Mentor Senior Software DeveloperCommented:
If you want this to all occur on the client side without multiple trips to the server (where PHP code resides), then this is purely a JavaScript question.

PHP only executes in response to requests from a user. It is not interacting with the webpage directly.

Unless you are using an AJAX framework to support a synthetic event driven link between the client and the server, all the user interface stuff happens solely on the client and can only be controlled by JavaScript.
0
 
aej1973Author Commented:
Interesting, thank you.
0
 
VIkasumitConnect With a Mentor Commented:
Hi,

just for your help here is the JS Code I found from internet.com and use it on many application .....


<form name=manMod>
<p><input type="button" name="add" value=">>" onclick="mover
('add');"></p>
<p><input type="button" name="remove" value="<<" onclick="mover
('remove');"></P>

Here is the function...

<script>

function mover(move){

      if(move == 'remove')
      {
            for(x = 0;x<(document.manMod.inBox.length);x++)
            {
                  if(document.manMod.inBox.options[x].selected)
                  {
                        with(document.manMod.outBox)
                        {
                              options[options.length] = new
                              Option(document.manMod.inBox.options[x].text,document.manMod.inBox.options[x].value);
                        }
                        document.manMod.inBox.options[x] = null;
                        x = -1;
                  }
            }
      }
      if(move == 'add')
      {
            
            for(x = 0;x<(document.manMod.outBox.length);x++)
            {
                  if(document.manMod.outBox.options[x].selected)
                  {
                        with(document.manMod.inBox)
                        {
                              options[options.length] = new
Option(document.manMod.outBox.options
[x].text,document.manMod.outBox.options[x].value);
                        }
                        document.manMod.outBox.options[x] =
null;
                        x = -1;
                  }
            }
      }
      return true;
}
</script>



<select name=outBox multiple>
<option>1</option>
<option>11</option>
<option>111</option>
</select>

<select name=inBox multiple>
<option>2</option>
<option>22</option>
<option>222</option>
</select>

</form>


VIkasumit
0
All Courses

From novice to tech pro — start learning today.