How do I do the products and quantity in the same form with PHP or jquery?

Ok so i have a form I need to find a good way of going the adding products to a system.

<form action="create.php" method="post" id="form">
  <table class="form">
    <tr>
      <td><span class="required">*</span> System Name:</td>
      <td><input name="name" value="" size="100" />
        </td>
    </tr>
    <tr>
      <td>Sort Order:<br/><span class="help">Set to -1 to hide from listing</span></td>
      <td><input name="sort_order" value="" size="1" /></td>
    </tr>
  </table>开发者_如何学运维;
</form>

So the problem is that a system has multiple products and each one of those products has its own quantity. So i was looking at a user friendly way of displaying the products. Here is my array with all the products. I was thinking a checkbox but that can get so long since there is 200 products in the db. I really want some sort of jquery draggable or something that will make it easy for the user....I am looking for any good suggestions....thanks again

<?php foreach ($products as $product) { ?>
    <!-- make the checkbox or something to all the user to pick the product and quantity -->
 <?php } ?>

Your best bet is a plugin that is already done, you can see a demo here for example: http://www.webresourcesdepot.com/wp-content/uploads/file/jquerydragdrop/

You can find the source code and tutorial here: http://www.webresourcesdepot.com/dynamic-dragn-drop-with-jquery-and-php/

I use these quite often and work really well. Things worth remembering and noting: I would add a handler (a button of a sort) to grab the line and move it around. This will allow you to add input fields and other info on the rest of the bar. Don't forget to add a order field in your DB or array. So that when it gets reorganised, it can be stored.

I hope this helps.