<html>

<head>
<title>Chained Selects Step-by-step: Implement the list group (Demo)</title>

<script language="javascript" src="chainedselects.js"></script>
<script language="javascript" src="content.js"></script>
</head>

<body onload="initListGroup('Direct materials', document.forms[0].category, document.forms[0].store_item_id_select);">

<table align="center" cellpadding="0" cellspacing="0" border="0" width="90%"><tr><td>
<center>

</center>

<p>&nbsp;</p>
</td></tr>
    <tr>
      <form>
            <td width="20"><input type="checkbox" name="line_checkbox0" id="line_checkbox0" onMouseUp="check_it()"  /></td>
          <td>
          
          
          <div id=store_item_divA0>
                        <img src=../images/line_edit.png width=16 height=12    id="add_icon0" onClick="document.getElementById('store_item_divA0').hidden=true; document.getElementById('store_item_divB0').hidden=false; document.getElementById('quantity_text0').value=''; document.getElementById('amount_text0').value=''; document.getElementById('store_item_text0').value =''; ">&nbsp;<input name="store_item_text0" id="store_item_text0" type="text" class="text300" value="-" readonly style="border:hidden; background-color:inherit; "> <input name="store_item_id0" id="store_item_id0" type="hidden" value="-">
          </div>
                <select name="category" id="category" style="width:160px;">
             </select>
              <input type="hidden" name="index0" id="index0">
              <select name="store_item_id_select" id="store_item_id_select0" style="width:160px;" onChange="
              document.getElementById('line_checkbox0').checked=true;
              unit = document.getElementById('store_item_id_select0').options[document.getElementById('store_item_id_select0').selectedIndex].text;
              unit2 = unit.split('~');
              unit3 = unit2[1];
              if (unit3=='no') {
              document.getElementById('quantity_text0').value = '';
              document.getElementById('quantity_text0').onkeypress = function num(event) { return numbersonly(this, event);}
              }
              else {
              document.getElementById('quantity_text0').value = '';
              document.getElementById('quantity_text0').onkeypress = function decnum(event) { return isNumberKey(event);}  
              }            
              document.getElementById('store_item_id0').value=document.getElementById('store_item_id_select0').value;
              document.getElementById('store_item_text0').value = document.getElementById('store_item_id_select0').value;
              document.getElementById('quantity_text0').disabled = false;
              document.getElementById('amount_text0').disabled = false;
              
              ">
              </select>
            <div id=store_item_divB0 hidden="hidden">
         
            </div> 
            
            </td>
          <td width="69" align="right"><input  name="quantity_text0" type="text" class="text60" id="quantity_text0" style="text-align:right" onKeyPress="return numbersonly(this, event)" value="-"  disabled="true"  size="10" autocomplete="off" onfocus = "this.select();"/>  
            </td>
            <td width="65" align="right"><input  name="amount_text0" type="text" class="text60" id="amount_text0" style="text-align:right" onKeyUp=" this.value = this.value.replace (/(\...).*/, '$1')" onKeyPress="return isNumberKey(event)" value="-"  disabled  size="10" autocomplete="off" onfocus = "this.select();"/><input type="hidden" name="line_num" id="line_num" value="1" onfocus = "this.select();">
        
            

        </td>   
     </form> 
            <!--<input name="textfield0" type="text" id="textfield0" size="5" value="1"></td>-->
        </tr>
  </table>

</body>

</html>