BBnepal-Accounts/library/application/views/lms-admin/issued-books.php

    <main class="common_margin" id="main">
        <div class="main-wrap">
            <div class="dashboard-cover">
                <div class="subject_r">
                    <div class="subject_rsec">
                        <a href="javascript:history.back()"><button class="btn btn-dark btn-sm">Back</button></a>
                        <div class="common-heading">
                            <h2><?= $title; ?></h2>
                            <div class="dashboard-btn-wrap">
                                <a href="<?= base_url(); ?>add-edit-issue-book/0"><button class="btn btn-success btn-sm">Issue Book</button></a>
                            </div>
                        </div>
                        <form id="issuedBookForm" method="POST">
                            <div class="top-filter">
                                <div class="filter_lbl">
                                    <i class="fas fa-filter"></i>
                                    Filter
                                </div>
                                <div class="date-filter">
                                    <div class="date-fil-row">
                                        <label>Start Date</label>
                                        <div class='po-calendar'>
                                            <input type="text" name="startdate" id="startdate" class="form-control txtData nepali-date">
                                            <i class='fas fa-calendar-alt cal-icon'></i>
                                        </div>
                                    </div>
                                    <div class="date-fil-row">
                                        <label>End Date</label>
                                        <div class='po-calendar'>
                                            <input type="text" name="enddate" id="enddate" class="form-control txtData nepali-date">
                                            <i class='fas fa-calendar-alt cal-icon'></i>
                                        </div>
                                    </div>
                                </div>
                                <div class="subject-filter">
                                    <select class="form-control txtData" name="option" id="option" onchange='search_call()'>
                                        <option value=''>All</option>
                                        <option value='over_due'>Over Due</option>
                                    </select>
                                </div>
                                <div class="filter-reset">
                                    <button type="button" id="filter_reset" class="subject_addbtn subject_addbtn_nobg">
                                        <i class="fas fa-redo"></i>Reset Filters
                                    </button>
                                </div>
                            </div>
                        </form>
                        <div class="" id="theIssedBookAreHere">
                            <?php
                            if (isset($issuedBookData))
                                echo $issuedBookData;
                            ?>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
    <!--End right-top side-->
    </div>

    <!-- <script src="assets/js/jquery-3.2.1.slim.min.js"></script> -->
    <script src="<?= base_url(); ?>assets-lms/js/jquery-3.4.1.min.js"></script>
    <script src="<?= base_url(); ?>assets-lms/js/popper.min.js"></script>
    <script src="<?= base_url(); ?>assets-lms/js/bootstrap.min.js"></script>
    <script defer src="<?= base_url(); ?>assets-lms/js/all.js"></script>
    <script defer src="<?= base_url(); ?>assets-lms/js/main.js"></script>
    <script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.1/js/bootstrap-select.min.js"></script>

    <!-- <script src="<?= base_url(); ?>assets-lms/owl-carousel/js/owl.carousel.min.js"></script> -->

    <script>
        $(document).ready(function() {
            $('.user-drpdown').click(function() {
                $('.drpdown-items').toggle();
            });

            $('.nepali-date').nepaliDatePicker({
                onChange: function() {
                    search_call();
                }
            });


        });


        //table js
        $('#tbl').DataTable({
            "lengthMenu": [
                [5, 10, 25, 50, -1],
                [5, 10, 25, 50, "All"]
            ]
        });
        //table js end

        //multiple select js start
        //$('select').selectpicker();
        //multiple select js end
    </script>
    <script>
        $('#filter_reset').click(function() {
            $('.txtData').val('');
            reload_issed_books();
        });
    </script>
    <script>
        function search_call() {
            reload_issed_books();
        }



        function reload_issed_books() {
            var values = $('#issuedBookForm').serialize();
            //alert(values);
            $.ajax({
                type: "POST",
                url: "<?php echo base_url(); ?>LmsAdmin/ajaxIssuedBookDetail",
                data: values,
                success: function(result) {
                    $('#theIssedBookAreHere').empty();
                    $('#theIssedBookAreHere').html(result);
                }
            });
        }
    </script>
    </body>

    </html>