JezK

Edit File: payments(old).php

<?php
include("header.php");

?>
<style>
div.dataTables_wrapper div.dataTables_filter {
    position: absolute;
    top: 154px;
}
</style>
<section class="section-padding" >
<div class="container">
  
    <ul class="nav nav-tabs border-0" role="tablist" id="myTab" >
        <li class="nav-item">
        <a class="nav-link active anc-Color" data-toggle="tab" href="#payment-h">Payment History</a>
        </li>
        
    </ul>
  
    <div class="tab-content  bg-white my-3">
        <div id="payment-h" class="container tab-pane active"><br>
            <div class="container pb-3">
                <div class="row">
                    
                    <div class="col-xl-6 col-sm-6 col-md-8 videoConf mt-2">
                        <label class="payment-l">Select Date Range</label>
                        <div id="reportrange" class=" formField-control" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc;">                             
                             <i class=" float-right "><img src="img/calenderdark.png"></i>
                             <span></span>
                        </div>
                    </div>
                    <form action="transactionExport.php" method="POST" id="exportdata" name="exportdata" onsubmit="return exporttransactions()">
                <div class="col-xl-12 col-sm-6 col-md-8 videoConf mt-2 ">
                        <label class="payment-l invisible">payments</label>
                    <input type="submit" class="btn btn-primary btn-sm w-100" value="Export data" />
                </div>
                    <input type="hidden" name="Export">
                    <input type="hidden" id="tfromdate"  name="tfromdate" value="">
                    <input type="hidden" id="ttodate"  name="ttodate" value="">
                    
                </form>
                    
                </div>
                <hr>
                <div id="">
                    
                    <div class="">
                        <table id="" class="table table-striped table-borderless" style="width:100%">
                            <thead class="tableBackground" >
                                <tr>
                                    
                                    <th>DATE</th>
                                    <th>PAYMENT TO</th>
                                    <th>AMOUNT</th>
                                </tr>
                            </thead>
                            <tbody id="paymentcontainer">
                                                
                            </tbody>
                        </table>
                    </div>
                           
                    
                </div>
            </div>
        </div>
        
    </div>
</div>
</section>
<input type="hidden" class="hidden "  name="" id="hiddenval"value="0">
<input type="hidden" class="hidden "  name="fromdate" value="">  
<input type="hidden" class="hidden "  name="todate" value="">   
<?php include("footer.php");?>

$(document).ready(function(){
	$('a[data-toggle="tab"]').on('show.bs.tab', function(e) {
		localStorage.setItem('activeTab', $(e.target).attr('href'));
	});
	var activeTab = localStorage.getItem('activeTab');
	if(activeTab){
		$('#myTab a[href="' + activeTab + '"]').tab('show');
	}
});
var fromdate=todate='';
var previouslimitstart=0;
$(function() { 
       getAppointments(0,fromdate,todate);       
      $('.page').on( 'scroll', function(){       
            if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight){
                var limitStart = $("#paymentcontainer .row").length;

if(previouslimitstart!=limitStart)
                {
                    getAppointments(limitStart,fromdate,todate);
                }
                previouslimitstart=limitStart; 
            }
        });
    });

function getAppointments(limitStart,fromdate,todate) {          
        if(limitStart==0){ 
            $("#paymentcontainer").html('');
        }
        if( $('#hiddenval').val()==0){
                var fromdate = '';
                var todate = '';
        }
        else
        {
            var s  =   $('#reportrange span').html();
            var arr1 = s.split("-")[0];
            var arr2 = s.split("-")[1];
            var fromdate1 = new Date(arr1);
            var todate2 = new Date(arr2);
            fromMonth = '' + (fromdate1.getMonth() + 1),
            fromDay = '' + fromdate1.getDate(),
            fromYear = fromdate1.getFullYear();

toMonth = '' + (todate2.getMonth() + 1),
            toDay = '' + todate2.getDate(),
            toYear = todate2.getFullYear();

var fromdate = fromYear+'-'+fromMonth+'-'+fromDay;
            var todate = toYear+'-'+toMonth+'-'+toDay;
        }
        $.post(
            "ajax.php", {               
                action:"paymenthistory",                
                min:limitStart,
                fromdate:fromdate,
                todate:todate
            },
            function(data) {

if(limitStart<=0 && !data)
                {
                    $("#paymentcontainer").html("");                    
                    $("#paymentcontainer").append("<tr></tr><td></td><td><h2 class='bg-goldImg text-center' style='padding: 10px;'>No Payment History</h2></</td>></tr>");
                  
                }
                else if (data) {
                    $("#paymentcontainer").append(data);
                }
            }
        );
    }
     $('#reportrange').on('apply.daterangepicker', function(ev, picker) {       
        var fromdate = picker.startDate.format('YYYY-MM-DD');
        var todate =picker.endDate.format('YYYY-MM-DD');
        $('#tfromdate').val(fromdate)
        $('#ttodate').val(todate)

$('#hiddenval').val('1');
        previouslimitstart=0;
        getAppointments(0,fromdate,todate); 
        
    });
</script>