<div id="container_ms_avg" style="height:100%; margin:0px; padding:0px;overflow:'hidden'; border: 0px solid #cd0a0a">
	<div class="pane-header ui-state-active" id="ms_avg_bar" >   
	<button type="button" id="ms_avg_create">PREVIEW & POSTING</button> 
		<button type="button" id="ms_avg_print">PRINT</button> 
		<button type="button" id="ms_avg_cancel">CANCEL</button>
	</div> 
<table id="ms_avg_tbl"></table> <div id="pms_avg_tbl"></div>
</div> 

<script type="text/javascript">
    
    $(document).ready(function(){
	  
	
	$(window).bind('resize', function() {  
		setTimeout(function(){
			setGridHight($("#ms_avg_tbl"),$("#container_ms_avg"),$("#ms_avg_bar")); 
		},10); 
	}); 
		 
	$("#ms_avg_create").button(); 
	$("#ms_avg_detail").button(); 
	$("#ms_avg_print").button();  
	$("#ms_avg_cancel").button();  

	 jQuery("#ms_avg_create").click(function(){ 
		  ms_avg_preview_and_posting('xls');
						 
	});
	function ms_avg_preview_and_posting(format){  
		var dialog = jQuery('<div />')
					 .html('<div class="ui-layout-content ui-widget-content-panel">\
									<label class="lbfield75">Posting Name</label>\
									<label class="lbcolon">:</label>\
									<input id="ms_avg_posting_name"    style="width:300px;margin-bottom:2px"  type="text" />\
									<br \ />\
								 	<label class="lbfield75">End of Data</label>\
									<label class="lbcolon">:</label>\
									<input id="ms_avg_end_date" name="ms_avg_end_date"   style="width:80px;margin-bottom:2px;"  class="date_edit" type="text" />\
									<br \ />\
									<label class="lbfield75">Posting Info</label>\
									<label class="lbcolon">:</label>\
									<input id="ms_avg_posting_info"name="ms_avg_posting_info"  row="2" style="width:300px;margin-bottom:2px"  type="text" />\
 								   </div>\
									<div class="pane-footer ui-state-default"></div>\
									<form hidden id="ms_avg_create_frm" method="POST" action="<?php echo base_url().'ms_avg/ct_ms_avg/preview_avg'; ?>"/>')
					.dialog({
				modal:true,
				width : 500,
				height : 200,
				title :'PREVIEW & POSTING AVG',
				buttons: { 
					"CLOSE": function(){
						dialog.dialog("close");  
					},
					"POSTING": function(){
						if ($("#ms_avg_posting_name").val()=='')
						{
							alert('Isi  Nama Final AVG ',function(){
								$("#ms_avg_posting_name").focus();
							}); 
							exit ;
						} 
						  if ($("#ms_avg_end_date").val()=='')
						{
							alert('Pilih Tanggal Akhir Data',function(){
								$("#ms_avg_end_date").focus();
							}); 
							exit ;
						} 
						   
						var form_edit = {      
						 		avg_name : $('#ms_avg_posting_name').val() , 
						 		info  : $('#ms_avg_posting_info').val() , 
						 		business_date  : getValueDate($("#ms_avg_end_date"),'yymmdd')
						}; 
						
						jQuery('.ui-dialog button:nth-child(3)').button('disable'); 
						jQuery('.ui-dialog button:nth-child(2)').button('disable'); 
						$.ajax({    
						url:'<?php echo base_url().'ms_avg/ct_ms_avg/create_avg'; ?>',
						type : 'POST',
							data : form_edit,
							dataType: 'json',
							success: function(msg){
								if (msg.valid){
									alert(msg.stsmsg);  
									dialog.dialog("close");  
								} else { alert(msg.stsno+msg.stsmsg);  }
							} 
						}).always(function() {
									jQuery('.ui-dialog button:nth-child(3)').button('enable'); 
									jQuery('.ui-dialog button:nth-child(2)').button('enable'); 
						});
						
					},
					"PREVIEW": function() { 
					if ($("#ms_avg_end_date").val()=='')
					{
						alert('Pilih Tanggal Akhir Data',function(){
							$("#ms_avg_end_date").focus();
						}); 
						exit ;
					} 
					end_date=getValueDate($("#ms_avg_end_date"),'yymmdd');
 				 	$("#ms_avg_create_frm").append($("<input>").attr({"value":end_date , "name":'end_date'})); 
					$("#ms_avg_create_frm").append($("<input>").attr({"value":format , "name":'format'})); 
				 	$("#ms_avg_create_frm").submit();   
					dialog.dialog("close");  
	 				}
				},
				close : function(){
					dialog.dialog('destroy').remove(); 
					$('#ms_avg_tbl').trigger('reloadGrid');
				},
				open: function(){
							jQuery('.ui-dialog button:nth-child(2)').attr('tabindex', jQuery('.ui-dialog button:nth-child(3)').attr('tabindex') +1);  
							jQuery('.ui-dialog button:nth-child(1)').attr('tabindex', jQuery('.ui-dialog button:nth-child(2)').attr('tabindex') +1);  
 					$( "#ms_avg_end_date" ).datepicker({
						dateFormat:'yy-mm-dd', 
						changeMonth: true,
						changeYear: true,
						numberOfMonths: 4,
						onClose: function( selectedDate ) {
						}
						});
						setTimeout(function(){
						$( "#ms_avg_posting_name" ).focus();
						},10); 
					$("body").unblock(); 
				}
			}); 
	
	} 

	  jQuery("#ms_avg_print").click(function(){  
			var mark_id = jQuery('#ms_avg_tbl').jqGrid('getGridParam','selrow');   
			if(!mark_id){ alert("Pililh AVG yang akan di print");exit;}    
			var $dialog =  $('<div />')
				 .html('<div class="ui-layout-content ui-widget-content-panel">\
													   </div>\
									<div class="pane-footer ui-state-default"></div>\
									<form hidden id="ms_avg_print_frm" method="POST" action="<?php echo base_url().'ms_avg/ct_ms_avg/print_avg'; ?>"/>')
					.dialog({
				modal:true,
				width : 500,
				height : 150,
				title :'PRINT FINAL AVG ',
				buttons: {
					"CLOSE": function(){
						$dialog.dialog("close");  
					} ,
					"PRINT": function(){ 
							var ret = jQuery("#ms_avg_tbl").jqGrid('getRowData',mark_id);  
							$("#ms_avg_print_frm").append($("<input>").attr({"value":ret.rID , "name":'header_id'})); 
							$("#ms_avg_print_frm").append($("<input>").attr({"value":'xls' , "name":'format'})); 
							$("#ms_avg_print_frm").submit();   
							dialog.dialog("close");    
					} , 
				},
				close : function(){
					$dialog.dialog('destroy').remove(); 
				},
				open: function(){
				$("body").unblock(); 
				}
			}); 
	}); 
		  
    
	
	  jQuery("#ms_avg_cancel").click(function(){  
			var mark_id = jQuery('#ms_avg_tbl').jqGrid('getGridParam','selrow');   
			if(!mark_id){ alert("Pililh AVG yang akan di cancel");exit;}    
			var $dialog =  $('<div />')
				.html(' <div class="ui-layout-content ui-widget-content-panel" style="margin-top:10px"> \
				<table class="tablefixed" > \
				<input type="hidden" id="doc_out_id23"> \
							<tr> \
							<td class="td100">Info Cancel</td> \
							  <td width="10"><div align="center">:</div></td> \
								<td colspan="3"><input name="txt_avg_info_cancel" type="text" id="txt_avg_info_cancel" style="width:100%;text-align:left;" /></td> \
							</tr> \
						</table> \
				</div>\
				<div class="pane-footer ui-state-default" />')
			 .dialog({
				modal:true,
				width : 500,
				height : 150,
				title :'CANCEL ',
				buttons: {
					"CLOSE": function(){
						$dialog.dialog("close");  
					} ,
					"CANCEL AVG": function(){ 
								var ret = jQuery("#ms_avg_tbl").jqGrid('getRowData',mark_id);    
						 	var form_edit = {      
									header_id  : ret.rID,
									info  : $('#txt_avg_info_cancel').val()  
							}; 
							
							jQuery('.ui-dialog button:nth-child(2)').button('disable'); 
							$.ajax({    
							url:'<?php echo base_url().'ms_avg/ct_ms_avg/cancel_avg'; ?>',
							type : 'POST',
								data : form_edit,
								dataType: 'json',
								success: function(msg){
									if (msg.valid){
										alert(msg.stsmsg);  
										$dialog.dialog("close");  
									} else { alert(msg.stsno+msg.stsmsg);  }
								} 
							}).always(function() {
										jQuery('.ui-dialog button:nth-child(2)').button('enable'); 
							});
							 
					} , 
				},
				close : function(){
					$dialog.dialog('destroy').remove();
					$('#ms_avg_tbl').trigger('reloadGrid');
				},
				open: function(){
				$("body").unblock(); 
				}
			}); 
	}); 
		  
    
	jQuery("#ms_avg_tbl").jqGrid({
			url:'<?php echo base_url().'ms_avg/ct_ms_avg/loaddata'; ?>',
			mtype : "post",
			postData:{'1':'1'},
			datatype: "json",
			colNames:[
			'ms_cost_final_avg_id','Status','AVG Name','Start Date','End Date','AVG Info','Create  Date'
			,'Create By','h_status_ms_cost_final_avg_status_id','Status Info','Status Date'
			,'Status By'
			]
			,colModel:[
			{name:'rID',index:'rID', width:80, hidden:true, align :'right'}
			,{name:'r8',index:'r8', width:80, stype: 'select', search:true, searchoptions:{searchhidden: true, value: '-100:All;1:Posting;-1:CANCEL'}}
			,{name:'r1',index:'r1', width:80, hidden:false, align :'left'}
			,{name:'r2',index:'r2', width:80, hidden:false, align :'left', searchoptions:{searchhidden: true,dataInit:function(el){$(el).datepicker({onSelect: function(date){jQuery("#table_name")[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:'r3',index:'r3', width:80, hidden:false, align :'left', searchoptions:{searchhidden: true,dataInit:function(el){$(el).datepicker({onSelect: function(date){jQuery("#table_name")[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:'r4',index:'r4', width:80, hidden:false, align :'left'}
			,{name:'r5',index:'r5', width:80, hidden:false, align :'left', searchoptions:{searchhidden: true,dataInit:function(el){$(el).datepicker({onSelect: function(date){jQuery("#table_name")[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:'r6',index:'r6', width:80, hidden:false, align :'right'}
			,{name:'r7',index:'r7', width:80, hidden:true, align :'right'}
			,{name:'r9',index:'r9', width:80, hidden:false, align :'right'}
			,{name:'r10',index:'r10', width:80, hidden:false, align :'left', searchoptions:{searchhidden: true,dataInit:function(el){$(el).datepicker({onSelect: function(date){jQuery("#table_name")[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:'r11',index:'r11', width:80, hidden:false, align :'right'}

			],
			rowNum:10,
			rowList:[10,20,30],
			pager: '#pms_avg_tbl',
			sortname: 'r2',
			viewrecords: true,
			sortorder: "desc",
			width: '',
			height: 100,
			//width: 950,
			//height:300,
			jsonReader: { repeatitems : false },
			caption:"DATA AVG",
			rownumbers: true,
			loadonce: false,
			shrinkToFit: false,
			multiselect: false,
			afterInsertRow: function(rowid, aData){
				/*switch (aData.statusdok) {
					case 'DATA SENT':
						jQuery("#ms_avg_tbl").jqGrid('setCell',rowid,'statusdok','',{color:'green'});
					break;
					case '2':
						jQuery("#ms_avg_tbl").jqGrid('setCell',rowid,'statusdok','',{color:'red'});
					break;
					case '1':
						jQuery("#ms_avg_tbl").jqGrid('setCell',rowid,'statusdok','',{color:'blue'});
					break;
					
				} */
			},
			gridComplete: function(){
				var rowIDs = jQuery("#ms_avg_tbl").getDataIDs(); 
				var rowData = $("#ms_avg_tbl").getRowData();
			
				for (var i = 0; i < rowData.length; i++) 
				{
				   var trElement = jQuery("#"+ rowIDs[i],jQuery('#ms_avg_tbl'));
				   
					switch (rowData[i].r7) {
						case '-1':
						   trElement.css({"color":"red"});
						break;
					}
				}
			},
		}); 
		/*
		jQuery("#ms_avg_tbl").jqGrid('setGroupHeaders', 
            { useColSpanStyle: true, groupHeaders:[
	 		{startColumnName: 'rID', numberOfColumns: 2, titleText: '<em><center>PART CUSTOM</center></em>'},
 			{startColumnName: 'ra1', numberOfColumns: 4, titleText: '<em><center>ALLOW TO</center></em>'}, 
			{startColumnName: 'r3', numberOfColumns: 5, titleText: '<em><center>TARIF</center></em>'}, 
			{startColumnName: 'r8', numberOfColumns: 2, titleText: '<em><center>CREATE</center></em>'}, 
			{startColumnName: 'r10', numberOfColumns: 2, titleText: '<em><center>MODIFY</center></em>'}, 
        ] });
			     */          
		jQuery("#ms_avg_tbl").jqGrid('navGrid','#pms_avg_tbl',{del:false,add:false,edit:false},{},{},{},{multipleSearch:false});
		jQuery("#ms_avg_tbl").jqGrid('filterToolbar',{stringResult: true,searchOnEnter : true, defaultSearch: 'cn', ignoreCase: true});
	
			
 		
	setTimeout(function(){
			setGridHight($("#ms_avg_tbl"),$("#container_ms_avg"),$("#ms_avg_bar")); 
		},100); 
	});
		  	
</script>

	
	