<div class="row clearfix">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
        <div class="card">
            <div class="header">
                <h2>VALIDATION TRANSACTION</h2>
            </div>
            <div class="body">
                <div class="row">
                    <div class="col-md-12">
                        <form id="fVal">
                            <input type="hidden" name="p" value="transaksi">
                            <input type="hidden" name="t" value="validasi">
                            <div class="form-group">
                                <label>Please Scan or Type the Barcode Receipt</label>
                                <div class="form-line">
                                    <input type="text" autocomplete="off" name="id" class="form-control barcode" required>
                                </div>
                            </div>
                            <div class="form-group">
                                <button type="submit" class="btn btn-sm bg-blue-grey waves-effect">Check Validation</button>
                                <div class="preloader pl-size-xs pull-right" style="display:none;" id="loading">
                                    <div class="spinner-layer pl-blue-grey">
                                        <div class="circle-clipper left">
                                            <div class="circle">
                                            </div>
                                        </div>
                                        <div class="circle-clipper right">
                                            <div class="circle">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="col-md-12">
                    	<div id="val_stat" style="font-weight:bold;"></div>
                        <div id="val_msg"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<style>
.label{
	font-size:14px;
}
</style>
<script>
$(function(){
	setTimeout(function(){$('.barcode').focus();},500);
	$("#fVal").submit(function(e) {
        e.preventDefault();
		var fdata = $(this).serialize();
		$.ajax({
			url: "processData.php",
			data: fdata,
			type: "POST",
			timeout: 6e5,
			success: function(a) {
				if(a.status==1){
					$("#val_stat").text(a.valid);
					$("#val_msg").html(a.msg);
				}else{
					swal({
						title: "Something Wrong!",
						text: a.msg,
						type: "error",
						showCancelButton: !1,
						closeOnConfirm: !0
					});
				}
				$("#fVal #loading").hide();
				$("#fVal *").removeAttr("disabled", "true");
			},
			error: function(a, e, t) {
				$("#fVal #loading").hide();
				$("#fVal *").removeAttr("disabled", "true");
				swal({
					title: "Something Wrong!",
					text: formatErrorMessage(a,e),
					type: "error",
					showCancelButton: !1,
					closeOnConfirm: !0
				},function(){
					if(a.responseText){
						$("#hasil").html(a.responseText);
					}else{
						$("#hasil").html("Error : "+formatErrorMessage(a,e));
					}
				});
			}
		});
    });
});
</script>