<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Admin| Log in</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <link rel="SHORTCUT ICON" HREF="<?php echo base_url()?>dist/logo.png">
  <!-- Bootstrap 3.3.6 -->
  <link rel="stylesheet" href="<?php echo base_url()?>bootstrap/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="<?php echo base_url()?>plugins/font-awesome/css/font-awesome.min.css">
  
  <!-- Theme style -->
  <link rel="stylesheet" href="<?php echo base_url()?>dist/css/AdminLTE.min.css">
  <!-- iCheck -->
  

  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>

  <![endif]-->
  <script>
  
</script>
</head>
<body class="hold-transition login-page">
<div class="login-box">
  <div class="login-logo">
    <a href="../../index2.html"><b>PRUfutureteam</b></a>
  </div>
  <!-- /.login-logo -->
  <div class="login-box-body">
    <p class="login-box-msg">Masukan Username dan Password</p>

    <form action="" method="post" id="login">
      <div class="form-group has-feedback">
        <input type="text" class="form-control" placeholder="Username" name="username">
        <span class="fa fa-user form-control-feedback"></span>
        <span class="help-block"></span>
      </div>
      <div class="form-group has-feedback">
        <input type="password" class="form-control" placeholder="Password" name="password">
        <span class="glyphicon glyphicon-lock form-control-feedback"></span>
        <span class="help-block"></span>
      </div>
      
    </form>
    <div class="row">
        <div class="col-xs-12">
         <button type="submit" class="pull-right btn btn-large blue" id="btnMasuk" onclick="login()" >Masuk</button>
        </div>
      
        <!-- /.col -->
      </div>
  </div>
  <!-- /.login-box-body -->
</div>
<a class="btn btn-sm btn-success" style="position:fixed;bottom:20px;right:20px;margin:0;" href="<?php echo base_url()?>absen">Kembali</a>
<!-- /.register-box -->
<!-- jQuery 2.2.3 -->
<script src="<?php echo base_url()?>plugins/jQuery/jQuery-2.1.4.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="<?php echo base_url()?>bootstrap/js/bootstrap.min.js"></script>
<!-- iCheck -->

<script>
$(document).ready(function() {
     //set input/textarea/select event when change value, remove class error and remove text help block 
    $("input").change(function(){
        $(this).parent().parent().removeClass('has-error');
        $(this).next().next().empty();
    });
  });
  function login(){
    $('#btnMasuk').text('masuk...'); //change button text
    $('#btnMasuk').attr('disabled',true); //set button disable 
    var url;
 url = "<?php echo site_url('beranda/loginact')?>";
    // ajax adding data to database
    $.ajax({
        url : url,
        type: "POST",
        data: $('#login').serialize(),
        dataType: "JSON",
        success: function(data)
        {

            if(data.status) //if success close modal and reload ajax table
            {
                $('#login')[0].reset(); // reset form on modals
                $('.form-group').removeClass('has-error'); // clear error class
                $('.help-block').empty(); // clear error string
             location.href = "<?php echo site_url('karyawan')?>"
            }
            else
            {
                for (var i = 0; i < data.inputerror.length; i++) 
                {
                    $('[name="'+data.inputerror[i]+'"]').parent().parent().addClass('has-error'); //select parent twice to select div form-group class and add has-error class
                    $('[name="'+data.inputerror[i]+'"]').next().next().text(data.error_string[i]); //select span help-block class set text error string
                }
            }
            $('#btnMasuk').text('masuk'); //change button text
            $('#btnMasuk').attr('disabled',false); //set button enable 


        },
        error: function (jqXHR, textStatus, errorThrown)
        {
            alert('Error adding / update data');
           
            

        }
    });

  }

</script>
</body>
</html>
