<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- <div class="page-header mt-5"> -->
    <div class="d-flex justify-content-between">
        <div>
            <h3 class=" tx-24 mg-b-5"><strong><?= $page; ?></strong></h4>
        </div>
        <div>
            <!-- <label>Pending</label>
            <input type="radio" name="filter" id="filter" class="filter" value="Pending">
                                <label>Completed</label>
            <input type="radio" name="filter" id="filter" class="filter" value="Completed"> -->
        </div>
    </div>
    <!-- </div>  -->
    <!-- Row -->
    <div class="row sidemenu-height">
        <div class="col-lg-12">
            <?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>
                    <?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>
                    <?php echo $this->session->flashdata('alert_danger'); ?>
                </div>
            <?php
            }
            ?>
            <div class="card custom-card">
                <div class="card-header justify-content-between d-flex">
                    <?php if ($page != 'Shortlisted') { ?>
                        <div class="col-md-3">
                            <div class="btn btn-info" onclick="shortlist()">Add to Shortlisted</div>
                        </div>
                    <?php } ?>
                    <div class="form-group col-md-3">
                        <select name="courseId" id="courseId" class="form-control filtercourse select2">
                            <option value="">-- Filter Course --</option>
                            <?php foreach ($courses as $row) { ?>
                                <option value="<?php echo $row->course_name ?>"> <?php echo $row->course_name ?></option>
                            <?php } ?>
                        </select>
                    </div>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table id="dmstable" class="table table-striped table-bordered dt-responsive nowrap" style="border-collapse: collapse; border-spacing: 0; width: 100%;">
                            <thead>
                                <tr>
                                    <th class="wd-20p">S.No</th>
                                    <th class="wd-20p">Ref.No</th>
                                    <th class="wd-25p">Name</th>
                                    <th class="wd-15p">Course Name</th>
                                    <th class="wd-15p">Fees</th>
                                    <th class="wd-15p">Mobile</th>
                                    <th class="wd-15p">Email</th>
                                    <th class="wd-15p">staus</th>
                                    <th class="wd-15p">Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                <?php
                                foreach ($records as $i => $row) { ?>
                                    <tr>
                                        <td><?php if ($page != 'Shortlisted') { ?><?php } ?><?= $i + 1 ?></td>
                                        <td><?= $row->reference_no ?></td>
                                        <td><?= $row->first_name ?></td>
                                        <td><?= $row->course_name; ?></td>
                                        <td><?= $row->application_fees; ?></td>
                                        <td><?= $row->mobile; ?></td>
                                        <td><?= $row->email; ?></td>
                                        <td><?= ($row->apstatus == '1') ? 'Completed' : 'Pending' ?></td>
                                        <td style="padding-right: 10px;">
                                            <a title="Preview" href="<?= base_url('ApplicationController/viewApplication/' . $row->user_id) ?>" class="open-in-new-tab"><i class="ti-eye text-info h4"></i></a>
                                            <a title="Edit" href="<?= base_url('ApplicationController/shortlist1/' . $row->user_id) ?>" class="btn-sm btn-info"><i class="ti-pencil-alt"></i></a>
                                        </td>
                                    </tr>
                                <?php  }
                                ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    </div>
    </div>
    <script>
       $(document).ready(function() {
            // When a link with the class "open-in-new-tab" is clicked
            $(".open-in-new-tab").click(function(event) {
                // Prevent the default behavior (opening the link in the current tab)
                event.preventDefault();

                // Get the URL from the href attribute of the clicked link
                var url = $(this).attr("href");

                // Open the URL in a new tab/window
                window.open(url, "_blank");
            });
        });
        
        function shortlist() {
            var checkedValues = [];
            $('.shortList:checked').each(function() {
                checkedValues.push($(this).val());
            });
            // alert(checkedValues);
            if (checkedValues) {
                $.ajax({
                    type: "POST",
                    url: "<?php echo base_url('ApplicationController/shortList'); ?>", // Corrected URL
                    data: {
                        id: checkedValues
                    },
                    success: function(respose) {
                        // alert('fggh');
                        window.location.reload();
                        // loadCourses(); // Reload the course list
                    },
                    error: function(error) {
                        console.error(error);
                    }
                });
            }
        }
        $(document).ready(function() {
            $('#dmstable').DataTable();
            // Add checkbox click event
            $('#dmstable tbody').on('click', 'input.checkbox', function() {
                var tr = $(this).closest('tr');
                if ($(this).prop('checked')) {
                    tr.addClass('selected');
                } else {
                    tr.removeClass('selected');
                }
            });
            $(".filtercourse").on("change", function() {
                // alert($(this).val());
                var columnIndex = 3;
                var filterValue = $(this).val();
                $('#dmstable').DataTable().column(columnIndex).search(filterValue).draw();
            });
            $(".filter").on("change", function() {
                // alert($(this).val());
                var columnIndex = 7;
                var filterValue = $(this).val();
                //    console.log("Column Index:", $(this).data("column"));
                // table.column(columnIndex).search(filterValue).draw();
                $('#dmstable').DataTable().column(columnIndex).search(filterValue).draw();
                // table.columns(7).search($(this).val()).draw();
                // dataTable.column($(this).data("column")).search(this.value).draw();
            });
            // table.buttons().container().appendTo("#dmstable .col-md-6:eq(0)");
        });
    </script>