<link href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js"></script>
<style>
.row_spc {
    margin: 20px !important;
}
</style>
<div class="row align-items-center">
    <div class="col-sm-6">
        <div class="page-title-box">
            <h4 class="font-size-18">Import Donation</h4>
            <ol class="breadcrumb mb-0">
                <li class="breadcrumb-item"><a href="javascript: void(0);">Import Donation</a></li>
                <li class="breadcrumb-item active">Add</li>
            </ol>
        </div>
    </div>
    <div class="col-sm-6">
        <div class="float-right d-none d-md-block">
            <a class="btn btn-primary waves-effect waves-light" href="<?php echo base_url(); ?>DonationController/donationList/">
                <i class="mdi mdi-plus mr-2"></i> View Donation
            </a>
        </div>
    </div>
</div>
<?php
   if($this->session->flashdata('alert_success'))
   {
   ?>
<div class="alert alert-success alert-dismissible fade show" role="alert">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">×</span>
    </button>
    <strong>Success!</strong> <?php echo $this->session->flashdata('alert_success'); ?>
</div>
<?php
   }
   
   if($this->session->flashdata('alert_danger'))
   {
   ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">×</span>
    </button>
    <strong>ERROR!</strong> <?php echo $this->session->flashdata('alert_danger'); ?>
</div>
<?php
   }
   
   if($this->session->flashdata('alert_warning'))
   {
   ?>
<div class="alert alert-warning alert-dismissible fade show" role="alert">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">×</span>
    </button>
    <strong>Success!</strong> <?php echo $this->session->flashdata('alert_warning'); ?>
</div>
<?php
   }
   if(validation_errors())
   {
       ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">×</span>
    </button>
    <?php echo validation_errors(); ?>
</div>
<?php
   }
   ?>
<div class="row">
    <div class="col-lg-12">
        <div class="card">
            <div class="card-body">
                <form action="<?php echo base_url();?>DonationController/importCSV" method="post" enctype="multipart/form-data">
                    <div class="row row_spc">
                        <div class="col-md-4">
                            
                            <a href="<?= base_url('DonationController/exportCSV') ?>" class="btn text-primary">Download CSV</a>                            
                        </div>
                        <div class="col-md-4">
                            <label class="required">Choose File</label>
                            <input name="upload_csv" required id="upload_csv" type="file" class="form-control">
                        </div>                       
                    </div>                   
            </div>
        </div>
        <div class="form-group mb-0">
            <div>
                <button name="submit" type="submit" class="btn btn-primary waves-effect waves-light mr-1">
                    Submit
                </button>
                <a href="<?php echo base_url(); ?>DonationController/import" class="btn btn-secondary waves-effect">Cancel </a>
            </div>
        </div>
        </form>
    </div>
</div>
</div>
</div>
<style type="text/css">
.required:after {
    content: " *" !important;
    color: red !important;
}
</style>
<script type="text/javascript">
$('#work').change(function() {
    if ($('#work').val() == '1') {
        $('.experience').show();
    } else {
        $('.experience').hide();
    }
}).change();

setTimeout(() => {
    $('#userDiv').hide();
}, 1000);
function get_type(val){
    if(val==1){
        $('#userDiv').hide();
    }else{
        $('#userDiv').show();
    }
}


function check() {

    var mobile = document.getElementById('mobile_no');


    var message = document.getElementById('message');

    var goodColor = "#0C6";
    var badColor = "#FF9B37";

    if (mobile.value.length != 10) {
        mobile.style.backgroundColor = badColor;
        message.style.color = badColor;
        message.innerHTML = "required 10 digits, match requested format!"
    } else {
        mobile.style.backgroundColor = goodColor;
        message.style.color = goodColor;
        message.innerHTML = ""
    }
}
</script>
<script>
$('#emp_status').select2();
</script>