<table class ="tablefixed" width="93%" border="0">
	<tr class="tr20">
		<td valign="top" class="tdauto">
			<div class="ui-layout-content ui-widget-content-panel" style="padding-top:1px;padding-bottom:1px">
				<table width="947" border="0">
					<tr>
						<td width="440" valign="top">
							<table width="440" border="0">
								<tr>
									<td width="69">PROD NO \ DATE</td>
									<td width="3"><div align="center">:</div></td>
									<td width="242"><input tabindex="1" id="ms_prod_part_list_view_prod_no" name="ms_prod_part_list_view_prod_no"  style="width:95%;margin-bottom:2px"   type="text"  readonly /></td>
									<td width="10"><div align="center">\</div></td>
									<td width="94"><input  tabindex="1" id="ms_prod_part_list_view_prod_date" name="ms_prod_part_list_view_prod_date"   style="width:90px;margin-bottom:2px"   type="text" readonly /></td>
								</tr>
								<tr>
									<td>PART LIST</td>
									<td width="3"><div align="center">:</div></td>
									<td width="242"><input tabindex="1" id="ms_prod_part_list_view_item_id" name="ms_prod_part_list_view_item_id"  style="width:95%;margin-bottom:2px"   type="text"  readonly /></td>
								</tr>
								<tr>
									<td>QUANTITY</td>
									<td width="3"><div align="center">:</div></td>
									<td width="242"><input tabindex="1" id="ms_prod_part_list_edit_qty" name="ms_prod_part_list_edit_qty"  style="width:95%;margin-bottom:2px"   type="text"  readonly /></td>
								</tr>
							</table>
						</td>
					</tr>
				</table> 
			</div>
		</td> 
	</tr>
	
	<tr class="trauto"> 
		<td class="tdauto" valign="top" id="container_ms_prod_part_list_view_tab"> 
			<table id="ms_prod_part_list_view_tbl_detail"></table> <div id="pms_prod_part_list_view_tbl_detail"></div>
		</td>
	</tr>
	
</table>

<script type="text/javascript">

$(document).ready(function(){
	
	$(window).bind('resize', function () {
		$("#ms_prod_part_list_view_tab").css("height", $("#container_ms_prod_part_list_view_tab").height() - 10);
		setGridHight(jQuery("#ms_prod_part_list_view_tbl_detail"),jQuery("#container_ms_prod_part_list_view_tab"),jQuery("#ms_prod_part_list_view_panel_action"),jQuery("#ms_prod_part_list_view_panel_action_result").height() +  jQuery("#container_ms_prod_part_list_view_tab ul").first().height() +30)
	});

	$("input.numeric").numeric(); 
	var ms_prod_part_list_view_row_detail_select;  
	var ms_prod_part_list_view_row_header<?php echo isset($row_data)?'='.json_encode($row_data):'=null';  ?>;  
  
	jQuery("#ms_prod_part_list_view_tbl_detail").jqGrid({
		url:'<?php echo base_url().'ms_production/ct_ms_prod_part_list/loaddata_detail'; ?>',
		mtype : "post",
		postData:{'a':'a'},
		datatype: "local",
		colNames:[
			 'id'
			,'ms_item_id'
			,'PART NO'
			,'PART NAME'
			,'UOM'
			,'QUANTITY'
			,'QTY PROD'
			,'QTY SUPPLY'
			,'QTY RECYCLE'
			,'CREATE DATE'
			,'CREATE BY'
			,'MODIFY DATE'
			,'MODIFY BY'
			,'ms_part_list_production_id'
		]
		,colModel:[
			 {name:'rID',index:'rID', width:80, hidden:true, align :'right', key:true}
			,{name:'r1',index:'r1', width:80, hidden:true, align :'right'}
			,{name:'r2',index:'r2', width:120, hidden:false, align :'left'}
			,{name:'r3',index:'r3', width:220, hidden:false, align :'left'}
			,{name:'r4',index:'r4', width:50, hidden:false, align :'left'}
			,{name:'r5',index:'r5', width:120, hidden:false, align :'right'} 
			,{name:'r6',index:'r6', width:120, hidden:false, align :'right'}
			,{name:'r7',index:'r7', width:120, hidden:false, align :'right'}
			,{name:'r8',index:'r8', width:120, hidden:false, align :'right'}
			
			,{name:'r9',index:'r9', width:120, hidden:false, align :'left', searchoptions:{searchhidden: true,dataInit:function(el){$(el).datepicker({onSelect: function(date){jQuery("#ms_prod_part_list_tbl_detail")[0].triggerToolbar();},changeMonth: true,changeYear: true,dateFormat:'dd/mm/yy', showButtonPanel: true, beforeShow: function(input) {  setTimeout(function() { var buttonPane = $(input).datepicker("widget").find( ".ui-datepicker-buttonpane" );   var btn = $('<button class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all" type="button">Clear</button>');   btn.unbind("click").bind("click", function () {   $.datepicker._clearDate( input );   });   btn.appendTo( buttonPane );  }, 1 );  }  });}}}
			,{name:'r10',index:'r10', width:100, hidden:false, align :'left'}

			,{name:'r11',index:'r11', width:120, hidden:false, align :'left', searchoptions:{searchhidden: true,dataInit:function(el){$(el).datepicker({onSelect: function(date){jQuery("#ms_prod_part_list_tbl_detail")[0].triggerToolbar();},changeMonth: true,changeYear: true,dateFormat:'dd/mm/yy', showButtonPanel: true, beforeShow: function(input) {  setTimeout(function() { var buttonPane = $(input).datepicker("widget").find( ".ui-datepicker-buttonpane" );   var btn = $('<button class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all" type="button">Clear</button>');   btn.unbind("click").bind("click", function () {   $.datepicker._clearDate( input );   });   btn.appendTo( buttonPane );  }, 1 );  }  });}}}
			,{name:'r12',index:'r12', width:100, hidden:false, align :'left'}
			,{name:'r13',index:'r13', width:80, hidden:true, align :'left'}
		],
		rowNum:100,
		rowList:[10,20,30,50,100,200,500],
		pager: '#pms_prod_part_list_view_tbl_detail',
		sortname: 'r1',
		viewrecords: true,
		sortorder: "desc",
		width: '',
		height: 240,
		jsonReader: { repeatitems : false },
		rownumbers: true,
		loadonce: false,
		shrinkToFit: false,
		multiselect: false,
		scrollrows:true,
		ondblClickRow: function (rowid) {
		},
		onSelectRow: function (rowid) { 
		},
		loadComplete: function () {	 
		},
		gridComplete: function () {
 
			var rowIDs = jQuery("#ms_prod_part_list_view_tbl_detail").getDataIDs(); 
			var rowData = $("#ms_prod_part_list_view_tbl_detail").getRowData(); 
			for (var i = 0; i < rowData.length; i++) 
			{
				var trElement = jQuery("#"+ rowIDs[i],jQuery('#ms_prod_part_list_view_tbl_detail'));
				
				switch (rowData[i].r_s) {
					case '1':
						trElement.css({"color":"red"});
					break;
					case '2':
						trElement.css({"color":"blue"});
					break;
				}
			}
		},
	}); 
	        
	jQuery("#ms_prod_part_list_view_tbl_detail").jqGrid('navGrid','#pms_prod_part_list_view_tbl_detail',{del:false,add:false,edit:false},{},{},{},{multipleSearch:false});
	jQuery("#ms_prod_part_list_view_tbl_detail").jqGrid('filterToolbar',{stringResult: true,searchOnEnter : true, defaultSearch: 'cn', ignoreCase: true});
 	
	jQuery("#ms_prod_part_list_view_tbl_detail").jqGrid('setGroupHeaders',{ useColSpanStyle: true, groupHeaders:[
		{startColumnName: 'r6', numberOfColumns: 3, titleText: '<em><center>QUANTITY</center></em>'}, 
	]});
	
	setCaptionToPanelMode("ms_prod_part_list_view_tbl_detail");
	setGridHight(jQuery("#ms_prod_part_list_view_tbl_detail"),jQuery("#container_ms_prod_part_list_view_tab"),jQuery("#ms_prod_part_list_view_panel_action"),jQuery("#ms_prod_part_list_view_panel_action_result").height() +  jQuery("#container_ms_prod_part_list_view_tab ul").first().height() +30);
  
	if (ms_prod_part_list_view_row_header){ 
	
		$('#ms_prod_part_list_view_prod_no').val(ms_prod_part_list_view_row_header.r2);     
		$('#ms_prod_part_list_view_prod_date').val(ms_prod_part_list_view_row_header.r3);        
		$('#ms_prod_part_list_view_item_id').val(ms_prod_part_list_view_row_header.r5);     
		$('#ms_prod_part_list_edit_qty').val(ms_prod_part_list_view_row_header.r6);    

		$("#ms_prod_part_list_view_tbl_detail").jqGrid('setGridParam', {postData: {header_id:ms_prod_part_list_view_row_header.rID}, datatype: 'json'});
		$('#ms_prod_part_list_view_tbl_detail').trigger('reloadGrid'); 
	}   
	
});
	
</script>
