<style>
    #InputFile{
        width:227px;
        color:#fff;
    }
    #InputFile > input{
        position:absolute;
        cursor:pointer;
        left:0px;
        top:0px;
        width:100%;
        height:100%;
        opacity:0.01;
    }
</style>
<div class="modal fade" role="dialog" id="UploadExcelFile" aria-hidden="true" style="display: none;">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel"><?php print CommonLanguage::getMessage('Import_Data');?></h4>
            </div><!-- end of modal-header -->
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <div class="alert hidden m-t-10" id="UploadAlert">
                            <?php print CommonLanguage::getMessage('Wrong_Type_Files');?>
                        </div>
                    </div>
                </div>
                <form method="post" enctype="multipart/form-data" id="Upload_Excel" onsubmit="return false">
                    <div class="row">
                        <div class=" col-md-12" >
                            <div class="col-md-12 m-t-10" >
                                <a href="<?php echo SITE_LINK;?>uploads/Templatexlsx/Leads.xlsx" id="TemplateReference">
                                    <i class="fa fa-download"></i>
                                    <?php print CommonLanguage::getMessage('Download_Template');?>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12" >    
                            <h4><?php print CommonLanguage::getMessage('Upload_Downloaded_File');?> </h4>
                            <button style="color:white !important;" class="btn bg-complete-dark cursor" id="InputFile">
                                <i style="color:white !important;" class="fa fa-upload"></i> 
                                <?php print CommonLanguage::getMessage('Upload');?> 
                                <input style="color:white !important;"  type="file" onchange="window.NewCurrentFileUploadadd = event.target.files;ValidateForNewFile(this,'#InputFile')" name="Document_File_Name" value="Upload">
                            </button>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal" id="CancelUpload"><?php print CommonLanguage::getMessage('Close');?></button>
                <button style="color:white !important;" class="btn bg-complete-dark text-white"  id="SaveExcelSheet"> <?php print CommonLanguage::getMessage('Save');?></button>
            </div>
        </div>
    </div>
</div>
<script>
    var Submitted_Successfully = <?php echo json_encode(CommonLanguage::getMessage('Submitted_Successfully'));?>;
    $(function(){	
        $("#CancelUpload").on("click",function(){
            $("#InputFile >.fa-check,#NewFilewarning2").hide()
            $("#InputFile >input").val('')
        })
    })
    $("#SaveExcelSheet").on("click",function(){
        $("#ValidationAlert").remove();
        var FileName = $.trim($("#InputFile > input").val())
        var FileType = FileName.substring(FileName.lastIndexOf("."));
        if(FileType == ".xlsx"){
            var Data = new FormData(document.getElementById("Upload_Excel"));
            $.ajax({
                url:'crmAjax/UploadExcelFileAjax',
                data:Data,
                method:"POST",
                processData: false,
                contentType: false,
                dataType:"json",
                complete:function(jqXHR,v2){
                    if(v2 == 'success'){
                        if (jqXHR.responseJSON[1] == "success") {
                            hideModalAlert('UploadExcelFile', 'UploadAlert');
                        }
                        $("#InputFile >input").val('')
                        $("#InputFile >.fa-check").hide()
                        AddAlert("#UploadAlert", jqXHR.responseJSON[0], jqXHR.responseJSON[1]);
                    }
                }
            })
        }else{
            $("#UploadAlert").attr('class','alert alert-danger').html("please upload excel file")
            setTimeout(function(){
                $("#UploadAlert").addClass("hidden")
            },2000)
        }
    })
    // ValidateFunction for file
    function ValidateForNewFile(input,inputID){
        var IsFileOK = false;
        $(inputID+" .fa-check").remove()
        if (input.files && input.files[0]){
            var reader = new FileReader();
            reader.onload = function () {
                $(inputID+" > .fa-times").hide()
                $(inputID).append(" <span class='fa fa-check'></span>")
            }
            reader.readAsDataURL(input.files[0]);
            return true;
        }
        return false;
    }
</script>