<div id="container_kursdownload_set" style="height:100%; margin:0px; padding:0px;overflow:'hidden'; border: 0px solid #cd0a0a">
	<div class="pane-header ui-state-active" id="kursdownload_set_bar" >    
		Date: <input id="txtTglKurs" type="text">
		<input id="btnTampilkan" type="button" style=" font-size: 11px; width: 75px" value="Tampilkan"> 
	</div>
	<table id="tblkursdownload"></table> <div id="ptblkursdownload"></div>   
</div>
<script type="text/javascript">
    
    $(document).ready(function(){
		$(window).bind('resize', function() {  
			setTimeout(function(){
				setGridHight($("#tblkursdownload"),$("#container_kursdownload_set"),$("#kursdownload_set_bar")); 
			},10); 
		});

		$('#txtTglKurs').datepicker({dateFormat:'yy-mm-dd'});
		$('#btnTampilkan').button();
		$('#btnTampilkan').click(function(){
			var mydata = {
				content:'browseKurs',
				txtTglKurs:$('#txtTglKurs').val()
			};
			
			jQuery('#divCekkurs').html('');

			$.ajax({
				url : "<?php echo base_url().'settings/ct_periode/cekkurs'; ?>",
				type : 'POST',
				data : mydata,
				success: function(msg){
					$("#divCekkurs").append(msg);
					jQuery("#tblkursdownload").trigger('reloadGrid')
				},
			});
		});

		var datePick = function (el) {
			$(el).datepicker({
				changeYear: true,
				changeMonth: true,
				showButtonPanel: true,
				onSelect: function () {
					
					if (this.id.substr(0, 3) === "gs_") {
                // in case of searching toolbar
					setTimeout(function(){
					jQuery("#tblkursdownload").jqGrid()[0].triggerToolbar();
						}, 50);
					} else {
						// refresh the filter in case of
						// searching dialog
						$(this).trigger('change');
					}
				}    
			});
		};
		
		jQuery("#tblkursdownload").jqGrid({
			url:'<?php echo base_url().'settings/ct_periode/loadkurs'; ?>',
			mtype : "post",
			postData:{'q':'1'},
			datatype: "json",
			colNames:['ID','KdKurs', 'TgAwal','TgAkhir', 'Nilai', 'Ket'],
			colModel:[
				{name:'id_kurs',index:'id_kurs', width:60, hidden:true},
				{name:'KdKurs',index:'KdKurs', width:160},
				{name:'TgAwal',index:'TgAwal', width:166,stype:"text",searchoptions:{dataInit:datePick, att:{title:'Select Date'}}},
				{name:'TgAkhir',index:'TgAkhir', width:166,stype:"text",searchoptions:{dataInit:datePick, att:{title:'Select Date'}}},
				{name:'Nilai',index:'Nilai', width:106, align:'right'},
				{name:'Ket',index:'Ket', width:166, hidden:false}
				],
			rowNum:25,
			rowList:[25,50,100],
			pager: '#ptblkursdownload',
			sortname: 'TgAwal',
			viewrecords: true,
			sortorder: "desc",
			width: '',
			height:100,
			jsonReader: { repeatitems : false },
			caption:"List kurs download",
			rownumbers: true,
			shrinkToFit: false,
			afterInsertRow: function(){
				
				
			},			
			gridComplete: function(){
				var rowIDs = jQuery("#tblkursdownload").getDataIDs(); 
				var rowData = $("#tblkursdownload").getRowData();
			
				for (var i = 0; i < rowData.length; i++) 
				{
				   var trElement = jQuery("#"+ rowIDs[i],jQuery('#tblkursdownload'));
				   
					switch (rowData[i].status_upload) {
						case 'Data Processed':
						   trElement.css({"color":"green"});
						break;
						case 'Deleted':
						   trElement.css({"color":"red", "text-decoration": "line-through"});
						break;
					}
				}
			},
		}); 
		
		jQuery("#tblkursdownload").jqGrid('navGrid','#ptblkursdownload',{del:false,add:false,edit:false},{},{},{},{multipleSearch:false});
		jQuery("#tblkursdownload").jqGrid('filterToolbar',{stringResult: true,searchOnEnter : false, defaultSearch: 'cn', ignoreCase: true});
		
		setTimeout(function(){
			setGridHight($("#tblkursdownload"),$("#container_kursdownload_set"),$("#kursdownload_set_bar")); 
		},100); 

	});
		  	
</script>
<div id="divCekkurs"></div>



	
	