Delay

Author: mcintyre321

Mvc.JQuery.Datatables.Templates/Content/jquery.dataTables.columnFilter.js

@@ -23,6 +23,17 @@
 
     $.fn.columnFilter = function(options) {
 
+
+        var delayer = (function () {
+            var timer = 0;
+            return function (callback, ms) {
+                clearTimeout(timer);
+                timer = setTimeout(callback, ms);
+            };
+        });
+
+        options.filterDelayInMs = options.filterDelayInMs || 500;
+
         var asInitVals, i, label, th;
 
         //var sTableId = "table";
@@ -125,37 +136,42 @@
 
             asInitVals[i] = label;
             var index = i;
-
+            var delay = new delayer();
             if (bIsNumber && !oTable.fnSettings().oFeatures.bServerSide) {
                 input.keyup(function() {
-                    /* Filter on the column all numbers that starts with the entered value */
-                    oTable.fnFilter('^' + this.value, _fnColumnIndex(index), true, false); //Issue 37
-                    fnOnFiltered();
+                    var that = this;
+                    delay(function() {
+                        /* Filter on the column all numbers that starts with the entered value */
+                        oTable.fnFilter('^' + that.value, _fnColumnIndex(index), true, false); //Issue 37
+                        fnOnFiltered();
+                    }, options.filterDelayInMs);
                 });
             } else {
                 input.keyup(function() {
-                    if (oTable.fnSettings().oFeatures.bServerSide && iFilterLength != 0) {
-                        //If filter length is set in the server-side processing mode
-                        //Check has the user entered at least iFilterLength new characters
-
-                        var currentFilter = oTable.fnSettings().aoPreSearchCols[index].sSearch;
-                        var iLastFilterLength = $(this).data("dt-iLastFilterLength");
-                        if (typeof iLastFilterLength == "undefined")
-                            iLastFilterLength = 0;
-                        var iCurrentFilterLength = this.value.length;
-                        if (Math.abs(iCurrentFilterLength - iLastFilterLength) < iFilterLength
-                            //&& currentFilter.length == 0 //Why this?
-                        ) {
-                            //Cancel the filtering
-                            return;
-                        } else {
-                            //Remember the current filter length
-                            $(this).data("dt-iLastFilterLength", iCurrentFilterLength);
+                    var that = this;
+                    delay(function() {
+                        if (oTable.fnSettings().oFeatures.bServerSide && iFilterLength != 0) {
+                            //If filter length is set in the server-side processing mode
+                            //Check has the user entered at least iFilterLength new characters
+
+                            var iLastFilterLength = $(that).data("dt-iLastFilterLength");
+                            if (typeof iLastFilterLength == "undefined")
+                                iLastFilterLength = 0;
+                            var iCurrentFilterLength = that.value.length;
+                            if (Math.abs(iCurrentFilterLength - iLastFilterLength) < iFilterLength
+                                //&& currentFilter.length == 0 //Why that?
+                            ) {
+                                //Cancel the filtering
+                                return;
+                            } else {
+                                //Remember the current filter length
+                                $(that).data("dt-iLastFilterLength", iCurrentFilterLength);
+                            }
                         }
-                    }
-                    /* Filter on the column (the index) of this element */
-                    oTable.fnFilter(this.value, _fnColumnIndex(index), regex, smart); //Issue 37
-                    fnOnFiltered();
+                        /* Filter on the column (the index) of that element */
+                        oTable.fnFilter(that.value, _fnColumnIndex(index), regex, smart); //Issue 37
+                        fnOnFiltered();
+                    }, options.filterDelayInMs);
                 });
             }
 
@@ -187,8 +203,7 @@
             //var currentFilter = oTable.fnSettings().aoPreSearchCols[i].sSearch;
             th.html(_fnRangeLabelPart(0));
             var sFromId = oTable.attr("id") + '_range_from_' + i;
-            var from = $('<input type="text" class="number_range_filter form-control" id="' + sFromId + '"  value = "' + fromDatePre + '" rel="' + i + '"/>')
-            ;
+            var from = $('<input type="text" class="number_range_filter form-control" id="' + sFromId + '"  value = "' + fromDatePre + '" rel="' + i + '"/>');
             th.append(from);
             th.append(_fnRangeLabelPart(1));
             var sToId = oTable.attr("id") + '_range_to_' + i;
@@ -230,20 +245,19 @@
                 }
             );
             //------------end range filtering function
+            var delay = new delayer();
+            $('#' + sFromId + ',#' + sToId, th).keyup(function () {
+                var that = this;
+                delay(function() {
+                    var iMin = document.getElementById(sFromId).value * 1;
+                    var iMax = document.getElementById(sToId).value * 1;
+                    if (iMin != 0 && iMax != 0 && iMin > iMax)
+                        return;
 
-
-            $('#' + sFromId + ',#' + sToId, th).keyup(function() {
-
-                var iMin = document.getElementById(sFromId).value * 1;
-                var iMax = document.getElementById(sToId).value * 1;
-                if (iMin != 0 && iMax != 0 && iMin > iMax)
-                    return;
-
-                oTable.fnDraw();
-                fnOnFiltered();
+                    oTable.fnDraw();
+                    fnOnFiltered();
+                }, options.filterDelayInMs);
             });
-
-
         }
 
 
@@ -332,13 +346,13 @@
                 }
             );
             //------------end date range filtering function
-
-            $('#' + sFromId + ',#' + sToId, th).change(function() {
-                oTable.fnDraw();
-                fnOnFiltered();
+            var delay = new delayer();
+            $('#' + sFromId + ',#' + sToId, th).change(function () {
+                delay(function() {
+                    oTable.fnDraw();
+                    fnOnFiltered();
+                }, 100);
             });
-
-
         }
 
         function fnCreateColumnSelect(oTable, aData, iColumn, nTh, sLabel, bRegex, oSelected, bMultiselect) {