<div style="height:40px;"> 
</div>
<table id="tblbc23detail"></table> <div id="ptblbc23detail"></div>
<input name="carbc23dtl" id="carbc23dtl" type="hidden" value="<?php echo $car; ?>" style="width: 175px;" />
<script type="text/javascript">
    
    $(document).ready(function(){
	$("#btnge").button();
	$("#btnge").click(function(){
			var car=$('#carbc23dtl').val();
			alert(car);
	});
	var datePick = function (el) {
	$(el).datepicker({
		changeYear: true,
		changeMonth: true,
		showButtonPanel: true,
		onSelect: function () {
			
		if (this.id.substr(0, 3) === "gs_") {
   
		setTimeout(function(){
		jQuery("#tblbc23hdr").jqGrid()[0].triggerToolbar();
			}, 50);
		} else {
			
			$(this).trigger('change');
		}
		}    
	});
	};
	
	jQuery("#tblbc23detail").jqGrid({

			url:'<?php echo base_url().'pasi_exim/ct_bc23/loaddatadetail'; ?>',
			mtype : "post",
			//postData:{'q':'1'},

			postData:{'carbc23dtl':$('#carbc23dtl').val()},
			datatype: "json",
			colNames:[	'CAR',
						'Serial',
						'NoHs',
						'KdBrg',
						'BrgUrai',
						'Merk',
						'Tipe',
						'SpfLain',
						'DNilInv',
						'KdSat',
						'JmlSat'	
					],
			colModel:[
					{name:'rID',index:'rID', width:200, hidden:false}, 
					{name:'r1',index:'r1', width:170, hidden:false}, 
					{name:'r2',index:'r2', width:60, hidden:false},
					{name:'r3',index:'r3', width:60, hidden:false},
					{name:'r4',index:'r4', width:60, hidden:false},
					{name:'r5',index:'r5', width:60, hidden:false}, 
					{name:'r6',index:'r6', width:60, hidden:false}, 
					{name:'r7',index:'r7', width:144, hidden:false},
					{name:'r8',index:'r8', width:60, hidden:false},
					{name:'r9',index:'r9', width:60, hidden:false},
					{name:'r10',index:'r10', width:60, hidden:false}	
			],
			rowNum:10,
			rowList:[10,20,30],
			pager: '#ptblbc23detail',
			sortname: 'car',
			viewrecords: true,
			sortorder: "desc",
			width: 1020,
			height:300,
			jsonReader: { repeatitems : false },
			caption:"List of BC 23 Detail",
			rownumbers: true,
			shrinkToFit: false,
			afterInsertRow: function(rowid, aData){
				/*switch (aData.statusdok) {
					case 'DATA SENT':
						jQuery("#tblbc23hdr").jqGrid('setCell',rowid,'statusdok','',{color:'green'});
					break;
					case '2':
						jQuery("#tblbc23hdr").jqGrid('setCell',rowid,'statusdok','',{color:'red'});
					break;
					case '1':
						jQuery("#tblbc23hdr").jqGrid('setCell',rowid,'statusdok','',{color:'blue'});
					break;
					
				} */
			},
			gridComplete: function(){
				var rowIDs = jQuery("#tblbc23detail").getDataIDs(); 
				var rowData = $("#tblbc23detail").getRowData();
			
				for (var i = 0; i < rowData.length; i++) 
				{
				   var trElement = jQuery("#"+ rowIDs[i],jQuery('#tblbc23detail'));
				   
					switch (rowData[i].statusdok) {
						case 'DATA PROCESSED':
						   trElement.css({"color":"green"});
						break;
						
						case 'SENT TO INVENTORY CANCELED':
						   trElement.css({"color":"green"});
						break;
						
						case 'DATA SENT TO INVENTORY':
						   trElement.css({"color":"purple"});
						break;
						case 'DATA PROCESSED INVENTORY':
						   trElement.css({"color":"blue"});
						break;
						case 'APPROVED INVENTORY':
						   trElement.css({"color":"red"});
						break;
					}
				}
			},
		}); 
			
                        
		jQuery("#tblbc23detail").jqGrid('navGrid','#ptblbc23detail',{del:false,add:false,edit:false},{},{},{},{multipleSearch:false});
		jQuery("#tblbc23detail").jqGrid('filterToolbar',{stringResult: true,searchOnEnter : false, defaultSearch: 'cn', ignoreCase: true});


	});
		  	
</script>
<div id="frmbc23detaildlg" title="Form BC23 Detail" class="frmbc23detaildlg_cl"></div>


	
	