Фильтрация таблицы HTML по DatePicker между двумя датами

Question

Я прочитал много тем о фильтрации html-таблицы по датчику между двумя датами, но я использую html-таблицу данных metronics.Это позволяет вам выполнять поиск по идентификатору, помещая значение datepicker в поиск, но я хочу фильтровать строки в определенном диапазоне дат, выбирая из datepicker.

Другие функции поиска и фильтрации работают отлично, но я не знаю, как это сделатьреализовать диапазон дат с помощью этих от-до фильтрации входных данных.Мой сборщик дат.

var DatatableHtmlTableDemo = function() {
    	//== Private functions

    	// demo initializer
    	var demo = function() {

    		var datatable = $('.m-datatable').mDatatable({
    			data: {
    				saveState: {cookie: false},
    			},
    			search: {
    				input: $('#generalSearch'),
    			},
    			columns: [
    				{
    					field: 'DepositPaid',
    					type: 'number',
    				},
    				{
    					field: 'OrderID',
    					type: 'number',
    				},
    				{
    					field: 'OrderDate',
    					type: 'date',
    					format: 'DD/MM/YYYY',
    				}, {
    					field: 'Status',
    					title: 'Status',
    					// callback function support for column rendering
    					template: function(row) {
    						var status = {
    							1: {'title': 'Alındı', 'class': 'm-badge--brand'},
    							2: {'title': 'İşlemde', 'class': ' m-badge--success'},
    							3: {'title': 'Kapandı', 'class': ' m-badge--metal'},
    						};
    						return '<span class="m-badge ' + status[row.Status].class + ' m-badge--wide">' + status[row.Status].title + '</span>';
    					},
    				},{
    					field: 'Owner',
    					title: 'Owner',
    					// callback function support for column rendering
    					template: function(row) {
    						var status = {
    							1: {'title': 'Ana Kademe', 'class': 'm-badge--success'},
    							2: {'title': 'Gençlik Kolları', 'class': ' m-badge--primary'},
    							3: {'title': 'Kadın Kolları', 'class': ' m-badge--danger'},
    						};
    						return '<span class="m-badge ' + status[row.Status].class + ' m-badge--wide">' + status[row.Status].title + '</span>';
    					},
    				}, {
    					field: 'Type',
    					title: 'Type',
    					// callback function support for column rendering
    					template: function(row) {
    						var status = {
    								<?php
    																
    		$komut = $db->prepare("SELECT * FROM kullanici_ilceler INNER JOIN ilceler ON kullanici_ilceler.ilce_no = ilceler.ilce_no WHERE kullanici_no = :kno");
            $komut->bindParam(':kno', $_COOKIE["user_id"], PDO::PARAM_STR); // PDO::PARAM_INT , PARAM_STR
            $komut->execute();
            $komut->setFetchMode(PDO::FETCH_ASSOC);

            while($satir = $komut->fetch()) {
                echo $satir["ilce_no"].": {'title': '".$satir["ilce_adi"]."', 'state': 'primary'}, ";
            }

    		?>
    						
    						};
    						return '<span class="m-badge m-badge--' + status[row.Type].state + ' m-badge--dot"></span>&nbsp;<span class="m--font-bold m--font-' +
    							status[row.Type].state + '">' +
    							status[row.Type].title + '</span>';
    					},
    				},
    			],
    		});

    		$('#m_form_status').on('change', function() {
    			datatable.search($(this).val().toLowerCase(), 'Status');
    		});



    		$('#m_form_type').on('change', function() {
    			datatable.search($(this).val().toLowerCase(), 'Type');
    		});

    		$('#m_form_status, #m_form_type').selectpicker();
            $('#m_datepicker').datepicker({
                todayHighlight: true,
                templates: {
                    leftArrow: '<i class="la la-angle-left"></i>',
                    rightArrow: '<i class="la la-angle-right"></i>',
                },
            });



    	};

    	return {
    		//== Public functions
    		init: function() {
    			// init dmeo
    			demo();
    		},
    	};
    }();

    jQuery(document).ready(function() {
    	DatatableHtmlTableDemo.init();

    });

<input id="from" type="text" class="form-control m-input" name="start" placeholder="From">
                                                            
<input id="to" type="text" class="form-control m-input" name="end" placeholder="To">
 
 <table>
    <thead> 
    <tr>
    <th title="Field #1" data-field="OrderID">Talep NO</th>
     <th title="Field #6" data-field="Color">Vatandaş TC</th>
     <th title="Field #7" data-field="DepositPaid">Vatandaş Adı</th>
     <th title="Field #5" data-field="CarModel">Talep Başlığı</th>
     <th title="Field #2" data-field="Type">Talebi Alan İlçe</th>
    <th title="Field #3" data-field="Contact">Talep Konusu</th>
    <th title="Field #10" data-field="Owner">Talebi Alan Kademe</th>
    <th title="Field #9" data-field="Status">Talep Durumu</th>
    <th title="Field #9" data-field="Date">Talep Tarihi</th>
    </tr>
    </thead>
 </table>