JQuery中的Datepicker和DataTable上的结果显示在Laravel应用程序中不起作用

Question

I'm using Laravel 5.4, and start using [Date Range Picker] by Dan Grossman1 to chose two dates, then a request by Ajax will get the response later with the results to show back in Yajra DataTable.

The Ajax side working well, I already test it and it is working well. but now my problem start after using Datepicker, where the results shown for the first time right and looks working, but when I pick and chose date then click submit on search button, It keep on same data before, which means Ajax not working with new changes, May I know the reason and how to fix it to make the data sent by AJAX request working well.

HTML Code:

<div id="reportrange"
    style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
    <i class="fa fa-calendar"></i>&nbsp;
    <span></span> <i class="fa fa-caret-down"></i>
</div>
<input type="submit" id="search_leads" name="search" value="search" class="btn btn-primary">

---

Jquery Code:

$(document).ready(function () {


    $(function () {

        var start = moment().subtract(15, 'days');
        var end = moment();

        function cb(start, end) {
            $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));

        }

        $('#reportrange').daterangepicker({
            startDate: start,
            endDate: end,
            ranges: {
                'Today': [moment(), moment()],
                'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                'This Month': [moment().startOf('month'), moment().endOf('month')],
                'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
            }
        }, cb);

        cb(start, end);
        // alert(start.format('YYYY-M-DD hh:mm:ss') + end.format('YYYY-M-DD hh:mm:ss'));


        var allUsersTable = $('.allleads').DataTable({
            processing: true,
            serverSide: true,
            // "bSort": false,
            ajax: {
                url: "{{ url('lead/GetAllLeads') }}",
                data: function (d) {
                    d.level = $('#levelFilter').val(),
                        d.start_time = start.format('YYYY-M-DD hh:mm:ss'),
                        d.end_time = end.format('YYYY-M-DD hh:mm:ss')
                }
            },
            {{--"ajax": "{{ url('lead/GetAllLeads') }}",--}}
            // "data": level = $('#levelFilter').val(),
            columns: [
                {"data": "lead", "name": "lead"},
                {"data": "email", "name": "email"},
            dom: 'Bfrtip',
            buttons: [
                'copy', 'csv', 'excel', 'pdf', 'print'
            ]
        });


        $("#search_leads").click(function () {
            allUsersTable.draw();
        });


    });

`