<!-- Widget ID (each widget will need unique ID)-->
<div class="jarviswidget" id="wid-id-6" data-widget-editbutton="false" data-widget-custombutton="false" data-widget-deletebutton="false">
	<!-- widget options:
		usage: <div class="jarviswidget" id="wid-id-0" data-widget-editbutton="false">
		
		data-widget-colorbutton="false"	
		data-widget-editbutton="false"
		data-widget-togglebutton="false"
		data-widget-deletebutton="false"
		data-widget-fullscreenbutton="false"
		data-widget-custombutton="false"
		data-widget-collapsed="true" 
		data-widget-sortable="false"
		
	-->
	<header>
		<span class="widget-icon"> <i class="fa fa-edit"></i> </span>
		<h2>Transaksi Uang Keluar</h2>				
		
	</header>

	<!-- widget div-->
	<div>
		
		<!-- widget edit box -->
		<div class="jarviswidget-editbox">
			<!-- This area used as dropdown edit box -->
			
		</div>
		<!-- end widget edit box -->
		
		<!-- widget content -->
		<div class="widget-body no-padding">
			
			<form action="<?php echo @$action; ?>" method="post" id="crud-form" class="smart-form">
				<header>
					<?php echo $header; ?>
				</header>

				<fieldset>
                <!--
					<div class="row">
						<section class="col col-3">
							<label class="label">Nomor Transaksi</label>
							<label class="input"> 
									<input id="last_id" type="hidden" name="last_id"  value="<?php echo @$last_id; ?>"/>									
									<?php echo $faktur; ?>									
							</label>
						</section>
					</div>
                    -->
					<div class="row">
						<!--
						<section class="col col-2">
							<label class="label">Tanggal Transaksi</label>							
								<label class="input"> 
									<input id="tanggaltransaksi" type="text" name="tanggaltransaksi"  value="<?php echo @$t_trans; ?>" />									
								</label>								
						</section>	
						-->
						<section class="col col-3">
							<label class="label">Diserahkan Oleh</label>							
								<label class="input"> 
									<input id="diserahkan" type="text" name="diserahkan"  value="<?php echo @$diserahkan; ?>" />									
								</label>								
						</section>
									
						<section class="col col-3">
							<label class="label">Diterima Oleh</label>							
								<label class="input"> 
									<input id="diterima" type="text" name="diterima"  value="<?php echo @$diterima; ?>" />									
								</label>								
						</section>			
					</div >					
				</fieldset>
				<header>
					Detail Transaksi
				</header>
				
				<fieldset>
				
					<?php echo @$trans_detail; ?>
				
				</fieldset>	
				
				<footer>
                <button type="submit" name="submit" id="myBtn" class="btn btn-primary" value="<?php echo $submit; ?>" onclick="buttonDis()">
						Save
					</button>
					<button type="reset" id="cancel_create" name="cancel" class="btn btn-default" >
						Batal
					</button>
				</footer>

				<div class="message">
					<i class="fa fa-check fa-lg"></i>
					<p>
						Your comment was successfully added!
					</p>
				</div>
			</form>
			
		</div>
		<!-- end widget content -->
		
	</div>
	<!-- end widget div -->
				
</div>
<!-- end widget -->

<script type="text/javascript">
	
	function buttonDis() {
		document.getElementById("myBtn").style.visibility="hidden";
	}
	
	function get_kddetail(kd_desk,num) {
		
		var url;		
		if (num > 1) {
			url = "<?php echo site_url("/") . $controller . "/get_kd_detail_secondRow"; ?>"; 
		} else {
			url = "<?php echo site_url("/") . $controller . "/get_kd_detail"; ?>";
		}
		
		$.ajax({
			type:"POST",
			dataType: "html",
			beforeSend : function() {
				if (num > 1) {
					$("#b_detail_"+num).html("Populating data, please wait..");
				} else {
					$("#b_detail").html("Populating data, please wait..");
				}	
				
			},
			url:url,
			data : "kd_desk="+kd_desk,
			success:function(msg){
				if (num > 1) {
					$("#b_detail_"+num).html(msg);
				} else {
					$("#b_detail").html(msg);
				}							
			},
			error:function(){
				alert("Load failed");
			}
		});
	}
		
	$(function() {
		
		//var max_fields      = 10; //maximum input boxes allowed
		var wrapper         = $(".input_fields_wrap"); //Fields wrapper
		var add_button      = $("#add_button"); //Add button ID
	    var kddesk 			= '<?php echo @$kd_desk; ?>';
		var urlDetail 		='<?php echo site_url("/") . $controller . "/get_kd_detail"; ?>';
		var x = <?php echo @$num; ?>;
		
		
		 //initlal text box count
		$(add_button).click(function(e){ //on add input button click
			e.preventDefault();
			//if(x < max_fields){ //max input box allowed
				x++; //text box increment
				$(wrapper).append('<div><div class="row"><section class="col col-2">\
							<label class="select"><select name="kodedesk[]" onchange="get_kddetail(this.value,'+x+')" id="kode_desk_'+x+'">\
									<option value="">--Select--</option>\
									'+kddesk+'\
									</select>\
									<i></i>\
							</label>\
						</section>\
						<section class="col col-2">\
						<div id="b_detail_'+x+'">\
							<label class="select">\
								<select name="kodesub[]" id="kode_sub_'+x+'">\
									<option value="">--Select--</option></select>\
								</select>\
								<i></i>\
							</label>\
						</div>\
						</section>\
						<section class="col col-3">\
							<label class="input"><input id="besarnya_'+x+'" type="text" name="besarnya[]"  value=""/></label>\
						</section>\
						<a href="#" class="remove_field"><i class="fa fa-lg fa-fw fa-times" style="padding-top:10px; color:red;"></i></a>\
					</div></div>'); //add input box
			//}
		});
	   
		$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
			e.preventDefault(); $(this).parent('div').remove(); x--;
		})
		
		$('#tanggaltransaksi').datetimepicker({
			format: 'DD-MM-YYYY'
		});
		
		alert_cancel = 'Are You Sure to cancel this form ?';
		$('#cancel_create').on('click', function () {
			if (confirm(alert_cancel)) {
				window.location.href = "<?php echo site_url('/').'home#'.$controller; ?>";
			}
		});
		
		// Validation
		$("#crud-form").validate({
			// Rules for form validation
			rules : {
				tanggaltransaksi : {
					required : true
					/*remote	 : {
						url		: "<?php echo base_url();?>index.php/adm_tahun_ajaran/cek_tahun_ajaran",
						type	: "POST",
						data: {
							tahun_ajaran: function() {
								return $("#tahun_ajaran").val();
							}
						}
					}*/	
					//remote : '<?php echo base_url();?>index.php/login/cek_user'		
				},
				diserahkan : {
					required : true
				},
				diterima : {
					required : true
				},
				'kodedesk[]': {
					required: true
				},
				'kodesub[]': {
					required: true
				},
				'besarnya[]': {
					required: true,
					number: true
				}
			},
			submitHandler : function(form) {
				
				$(form).ajaxSubmit({
					/* beforeSubmit: function() {
						$("#hiddenElement").val("false");
						$("#cancel").attr("disabled","disabled");
						$("#button_id").attr("disabled","disabled");
						//$("button[type=submit]").append('<i class="fa fa-gear fa-1x fa-spin"></i>');
						$("#button_id").append('<i class="fa fa-gear fa-1x fa-spin">');
					}, */
					dataType: 'json',
					success : function(msg) {
						window.location.hash = base_url + 'index.php/<?php echo $controller; ?>/successPage';
						/* if (msg.msg == "noauth") {
							window.location = base_url;
						}
						else if (msg.error == true) {
							write_error_html(msg.field);
							
							//button manipulating
							$("#hiddenElement").val("true");
							$(".fa-spin").remove();
							$("#cancel").removeAttr("disabled");
							$("#button_id").removeAttr("disabled");
						} else {
							window.location.hash = base_url + 'create_agent/';
						} */
					}
				});
				
			},

			// Messages for form validation
			messages : {
				tanggaltransaksi : {
					required : 'Tanggal Transaksi Harus di isi'
						
				},
				diserahkan : {
					required : 'Tidak Boleh Kosong'
						
				},
				diterima : {
					required : 'Tidak Boleh Kosong'
						
				},
				'besarnya[]' : {
					required : 'Isi Besarnya',
					number	 : 'Field Besarnya Harus Angka'
				},
				'kodedesk[]' : {
					required : 'Pilih Kode Deskripsi'
				},
				'kodesub[]' : {
					required : 'Pilih Kode Detail'
				}
			},

			// Do not change code below
			errorPlacement : function(error, element) {
				error.insertAfter(element.parent());
			}
		});		
		
	});
</script>