diff --git a/dns/templates/dns/addDeleteDNSRecordsCloudFlare.html b/dns/templates/dns/addDeleteDNSRecordsCloudFlare.html
index 3efd5a51f..c7703bf51 100644
--- a/dns/templates/dns/addDeleteDNSRecordsCloudFlare.html
+++ b/dns/templates/dns/addDeleteDNSRecordsCloudFlare.html
@@ -973,7 +973,7 @@
                                             No DNS records found.
                                         </div>
                                         
-                                        <div ng-if="!loadingRecords && records.length > 0 && dnsSearch.filter && (records | dnsRecordSearch:dnsSearch.filter).length === 0" class="alert alert-info" style="margin-bottom: 1rem;">
+                                        <div ng-if="!loadingRecords && records.length > 0 && dnsSearch.filter && filteredRecords.length === 0" class="alert alert-info" style="margin-bottom: 1rem;">
                                             <i class="fas fa-info-circle"></i> {% trans "No records match your search." %}
                                         </div>
                                         
@@ -1003,7 +1003,7 @@
                                                 </tr>
                                             </thead>
                                             <tbody>
-                                                <tr ng-repeat="record in records | dnsRecordSearch:dnsSearch.filter | orderBy:sortColumn:sortReverse track by record.id">
+                                                <tr ng-repeat="record in filteredRecords track by record.id">
                                                     <td class="editable-cell">
                                                         <span ng-hide="isEditing(record, 'name')" ng-click="startEdit(record, 'name')" class="cell-click" title="{% trans 'Click to edit' %}"><strong ng-bind="record.name"></strong></span>
                                                         <input ng-show="isEditing(record, 'name')" type="text" class="inline-input" ng-model="record.name" ng-blur="saveInlineField(record, 'name')" ng-keypress="$event.keyCode === 13 && saveInlineField(record, 'name')">
diff --git a/public/static/dns/dns.js b/public/static/dns/dns.js
index 467141998..dba1d46ef 100644
--- a/public/static/dns/dns.js
+++ b/public/static/dns/dns.js
@@ -1174,6 +1174,39 @@ app.controller('addModifyDNSRecordsCloudFlare', function ($scope, $http, $window
         return list;
     };
     $scope.dnsSearch = { filter: '' };
+    $scope.filteredRecords = [];
+    function applySearchAndSort() {
+        if (!$scope.records || !Array.isArray($scope.records)) {
+            $scope.filteredRecords = [];
+            return;
+        }
+        var q = ($scope.dnsSearch && $scope.dnsSearch.filter != null ? String($scope.dnsSearch.filter) : '').toLowerCase().trim();
+        var list = q === '' ? $scope.records : $scope.records.filter(function (r) {
+            var name = (r.name != null ? String(r.name) : '').toLowerCase();
+            var type = (r.type != null ? String(r.type) : '').toLowerCase();
+            var content = (r.content != null ? String(r.content) : '').toLowerCase();
+            var priority = (r.priority != null ? String(r.priority) : '');
+            return name.indexOf(q) !== -1 || type.indexOf(q) !== -1 || content.indexOf(q) !== -1 || priority.indexOf(q) !== -1;
+        });
+        var col = $scope.sortColumn || 'name';
+        var rev = $scope.sortReverse;
+        list = list.slice().sort(function (a, b) {
+            var va = a[col];
+            var vb = b[col];
+            if (va === vb) return 0;
+            if (va == null) return rev ? -1 : 1;
+            if (vb == null) return rev ? 1 : -1;
+            if (typeof va === 'number' && typeof vb === 'number') return rev ? vb - va : va - vb;
+            va = String(va).toLowerCase();
+            vb = String(vb).toLowerCase();
+            return rev ? (vb < va ? 1 : -1) : (va < vb ? -1 : 1);
+        });
+        $scope.filteredRecords = list;
+    }
+    $scope.$watchCollection('records', function () { applySearchAndSort(); });
+    $scope.$watch('dnsSearch.filter', function () { applySearchAndSort(); }, true);
+    $scope.$watch('sortColumn', function () { applySearchAndSort(); });
+    $scope.$watch('sortReverse', function () { applySearchAndSort(); });
     $scope.matchDnsSearch = function (record) {
         var q = (($scope.dnsSearch && $scope.dnsSearch.filter) != null ? String($scope.dnsSearch.filter) : '').toLowerCase().trim();
         if (!q) return true;
diff --git a/static/dns/dns.js b/static/dns/dns.js
index a60f11fc4..c0f4d34cf 100644
--- a/static/dns/dns.js
+++ b/static/dns/dns.js
@@ -1178,6 +1178,39 @@ app.controller('addModifyDNSRecordsCloudFlare', function ($scope, $http, $window
         return list;
     };
     $scope.dnsSearch = { filter: '' };
+    $scope.filteredRecords = [];
+    function applySearchAndSort() {
+        if (!$scope.records || !Array.isArray($scope.records)) {
+            $scope.filteredRecords = [];
+            return;
+        }
+        var q = ($scope.dnsSearch && $scope.dnsSearch.filter != null ? String($scope.dnsSearch.filter) : '').toLowerCase().trim();
+        var list = q === '' ? $scope.records : $scope.records.filter(function (r) {
+            var name = (r.name != null ? String(r.name) : '').toLowerCase();
+            var type = (r.type != null ? String(r.type) : '').toLowerCase();
+            var content = (r.content != null ? String(r.content) : '').toLowerCase();
+            var priority = (r.priority != null ? String(r.priority) : '');
+            return name.indexOf(q) !== -1 || type.indexOf(q) !== -1 || content.indexOf(q) !== -1 || priority.indexOf(q) !== -1;
+        });
+        var col = $scope.sortColumn || 'name';
+        var rev = $scope.sortReverse;
+        list = list.slice().sort(function (a, b) {
+            var va = a[col];
+            var vb = b[col];
+            if (va === vb) return 0;
+            if (va == null) return rev ? -1 : 1;
+            if (vb == null) return rev ? 1 : -1;
+            if (typeof va === 'number' && typeof vb === 'number') return rev ? vb - va : va - vb;
+            va = String(va).toLowerCase();
+            vb = String(vb).toLowerCase();
+            return rev ? (vb < va ? 1 : -1) : (va < vb ? -1 : 1);
+        });
+        $scope.filteredRecords = list;
+    }
+    $scope.$watchCollection('records', function () { applySearchAndSort(); });
+    $scope.$watch('dnsSearch.filter', function () { applySearchAndSort(); }, true);
+    $scope.$watch('sortColumn', function () { applySearchAndSort(); });
+    $scope.$watch('sortReverse', function () { applySearchAndSort(); });
     $scope.matchDnsSearch = function (record) {
         var q = (($scope.dnsSearch && $scope.dnsSearch.filter) != null ? String($scope.dnsSearch.filter) : '').toLowerCase().trim();
         if (!q) return true;