

<!-- 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>Referece -Cicilan</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">Chard Of Account</label>
							<div id="block_coa">
								<?php echo @$coa; ?>
							</div>
						</section>
                    </div>
					<div class="row">
                    	<section class="col col-2">
							<label class="label">Sekolah</label>
							<?php echo $nama_smk; ?>
						</section>
                        
                        <section class="col col-2">
							<label class="label">Type</label>
								<label class="input"> 
									<input id="id-type_cicil" type="text" name="type_cicil"  value="<?php echo @$type_cicil; ?>" autocomplete="off" />									
								</label>
								
						</section>	
                        <!--
                        <section class="col col-3">
							<label class="label">Tahun Ajaran</label>
							<label class="input">				
                                <input id="tahun_ajaran" type="text" name ="tahun_ajaran" value="<?php echo @$tahun_ajaran; ?>" />
							</label>
						</section>
                        -->
						<section class="col col-3">
							<label class="label">Jenis Pembayaran</label>
							<label class="input">				
								<input id="id" type="hidden" name ="id" value="<?php echo @$id; ?>" />
								<input id="id-jenis_pembayaran" type="text" name="jenis_pembayaran"  value="<?php echo @$jenis_pembayaran; ?>" autocomplete="off" />
							</label>
						</section>
						
						<section class="col col-2">
							<label class="label">Besarnya</label>
							
								<label class="input"> 
									<input id="id-besarnya" type="text" name="besarnya"  value="<?php echo @$besarnya; ?>" autocomplete="off" />									
								</label>
								
						</section>									
					</div>			
                    <div class="row">
                    <section class="col col-2">
							<label class="label">Dari</label>
								
								<label class="input"> 
								
									<div id="datetimepicker" class="input-group" >
									<input type="text" id="tanggal_awal" name="tanggal_awal" value="<?php echo @$t_awal; ?>" autocomplete="off" />
										<span class="input-group-addon">
										<span class="glyphicon glyphicon-calendar"></span>
										</span>
									</div>		
									
								</label>							
						</section>	
                         <section class="col col-2">
							<label class="label">Sampai</label>
								
								<label class="input"> 
								
									<div id="datetimepicker" class="input-group" >
									<input type="text" id="tanggal_akhir" name="tanggal_akhir" value="date(<?php echo @$t_akhir; ?>)" autocomplete="off" />
										<span class="input-group-addon">
										<span class="glyphicon glyphicon-calendar"></span>
										</span>
									</div>		
									
								</label>							
						</section>	
                        </div>					
					
				</fieldset>

				<footer>
					<button type="submit" name="submit" class="btn btn-primary" value="<?php echo $submit; ?>">
						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() {
		
		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; ?>";
			}
		});
		$('#tanggal_awal').datetimepicker({
			format: 'YYYY-MM-DD'
		});
		$('#tanggal_akhir').datetimepicker({
			format: 'YYYY-MM-DD'
		});
		// Validation
		$("#crud-form").validate({
			// Rules for form validation
			rules : {
				tanggal_awal : {
					required : true						
				},
				tanggal_akhir : {
					required : true						
				},
				besarnya : {
					required : true,
					number	: true
				},
				jenis_pembayaran : {
					required : true
				},
				smk : {
					required : true
				},
				type_cicil : {
					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; ?>/';						
					}
				});
				
			},

			// Messages for form validation
			messages : {
				
				besarnya : {
					required : 'Cantumkan Besarnya SPP',
					number : 'Besarnya SPP Harus Angka'
				},
				tanggal_awal : {
					required : 'Isi Tanggal Awal'
				},
				tanggal_akhir : {
					required : 'Isi Tanggal Akhir'
				},
				jenis_pembayaran : {
					required : 'Isi Reference Name'
				},
				smk : {
					required : 'Isi Reference Nama Sekolah'
				},
				type_cicil : {
					required : 'Isi Type',
					number : 'Besarnya Type Harus Angka'
				}
			},

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