Date range filter not working

im trying to filter the DatePickedUp field with range but my code doesnt working plesase help thanks.

<div class="ContainerBanner">
<h3 class="pickups">Packagesh3> <br />
<p id="date_filter">
<span id="date-label-from" class="date-label">From: span><input class="date_range_filter date" type="text" id="datepicker_from" />
<span id="date-label-to" class="date-label">To: span><input class="date_range_filter date" type="text" id="datepicker_to" />
p>
<table id="example" class="display table table-striped" style="width:100%">
<thead>
<tr>
<th>Package #th>
<th>Tracking #th>
<th>Agentth>
<th>Clientth>
<th>Contact #th>
<th>Addressth>
<th>Date Postedth>
<th>Pickup Dateth>
<th>Statusth>
<th>Date Pickedupth>
<th>Notesth>
<th>th>
tr>
thead>
<tbody>tbody>
table>
@if ((Roles.IsUserInRole("Administrator")) || (Roles.IsUserInRole("Agent")) || (Roles.IsUserInRole("Sub-Agent")))
{
<a href="@Url.Action("addoredit", "pickup")" class="btn btn-primary btn-sm"><i class="fas fa-calendar-check">i> Schedule a Pickupa>
}
div>

"text/javascript">
$(function () {
var oTable = $('#example').DataTable({
"ajax": "@Url.Action("getpickuplist", "pickup")",
"oLanguage": { "sSearch": "Filter Data" },
"sPaginationType": "full_numbers",
"columns": [
{ "data": "ReferenceNumber" },
{ "data": "TrackingNumber" },
{ "data": "AgentName" },
{ "data": "ClientFullName" },
{ "data": "PrimaryContact" },
{ "data": "Address" },
{ "data": "DatePosted" },
{ "data": "PickupDate" },
{ "data": "Status" },
{ "data": "DatePickedup" },
{ "data": "Notes" },
{
"render": function (data, type, full, meta) {
return " + full.Id + ")'>"
}
}
]
});
$("#datepicker_from").datepicker({
showOn: "button",
buttonImage: "images/calendar.gif",
buttonImageOnly: false,
"onSelect": function (date) {
minDateFilter = new Date(date).getTime();
oTable.fnDraw();
}
}).keyup(function () {
minDateFilter = new Date(this.value).getTime();
oTable.fnDraw();
});
$("#datepicker_to").datepicker({
showOn: "button",
buttonImage: "images/calendar.gif",
buttonImageOnly: false,
"onSelect": function (date) {
maxDateFilter = new Date(date).getTime();
oTable.fnDraw();
}
}).keyup(function () {
maxDateFilter = new Date(this.value).getTime();
oTable.fnDraw();
});
});
// Date range filter
minDateFilter = "";
maxDateFilter = "";
$.fn.dataTableExt.afnFiltering.push(
function (oSettings, aData, iDataIndex) {
if (typeof aData._date == 'undefined') {
aData._date = new Date(aData[9]).getTime();
}
if (minDateFilter && !isNaN(minDateFilter)) {
if (aData._date < minDateFilter) {
return false;
}
}
if (maxDateFilter && !isNaN(maxDateFilter)) {
if (aData._date > maxDateFilter) {
return false;
}
}
return true;
}
);