this is the dropdown I am using to send true or false value :

<div class="col-md-6 my-2 my-md-0">
    <div class="d-flex align-items-center">
        <label class="mr-3 mb-0 d-none d-md-block">Status:</label>
          <select class="form-control" id="CountryDataTableStatus">
             <option value="">All</option>
             <option value="true">Active</option>
             <option value="false">Inactive</option>
          </select>
     </div>
</div>

KTdatatable block :-

field: 'ActiveStatus',
title: 'Status',
\// callback function support for column rendering
template: function (data) {
 var StatusClass = ''; var StatusTitle = '';
if (data.ActiveStatus == true) {
    StatusClass = 'checked'; StatusTitle = 'true';
}
else if (data.ActiveStatus == false) {
     StatusClass = 'unchecked'; StatusTitle = 'false';
}
                                  
return '<span class="switch switch-outline switch-icon switch-primary"><label><input type="checkbox" ' + StatusClass + ' value="' + StatusTitle + '" id="IsStateActiveSwitch' + data.Id + '" onchange="IsStateActive(' + data.Id + ')" /> <span></span></label></span>'

to trigger I am using :

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

if I select active i.e. with true value it works proper but if I select inactive i.e. with false value is not working

please help thanks in advance!!