<div class="breadcrumb">
    <h1>Pay Clinic Cards</h1>
    <ul>
        <li><a href="<?php echo SITE_URL.ADMIN_DIR; ?>">Dashboard</a></li>
        <li>Pay Clinic Cards</li>
    </ul>
</div>
<div class="separator-breadcrumb border-top"></div>

<div class="row mb-4">
    <div class="col-md-12 mb-4">
        <div class="card text-left">
            <div class="card-body">
                <div class="table-responsive">
                    <form id="listFrm" name="listFrm" action="" method="post">
                        <table id="list" class="display table table-striped table-bordered" style="width:100%">
                            <thead>
                                <tr>
                                    <th class="center"><input type="checkbox" name="checkall" id="checkall"></th>
                                    <th>ID</th>
                                    <th>Clinic</th>
                                    <th>Card Name</th>
                                    <th>Brand</th>
                                    <th>Last 4</th>
                                    <th>Exp Month</th>
                                    <th>Exp Year</th>
                                    <th>Status</th>
                                    <th>Created At</th>
                                </tr>
                            </thead>
                        </table>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="application/javascript">
    $(document).ready(function () {
        $('#list').DataTable({
            "ajax": "payClinicCardList.php?act=load",
            "processing": true,
            "serverSide": true,
            "pageLength": 25,
            "aaSorting": [],
            "aoColumnDefs": [
                { 'bSortable': false, 'aTargets': [0] }
            ],
            language: {
                "processing": "<div class='loader-bubble loader-bubble-primary m-5'></div>",
                "sEmptyTable": "No records found."
            }
        });

        $("#checkall").on("click", function () {
            var checked = this.checked;
            $(".check_class").each(function () {
                this.checked = checked;
            });
        });
    });
</script>

