Last active
January 1, 2017 17:39
-
-
Save sdgluck/bd9be73eccdf1ce8a1a2 to your computer and use it in GitHub Desktop.
Simple HTML5 date filter for ag-grid. Requires: moment.js
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
var moment = require('moment'); | |
var template = '' + | |
'<div class="ag-date-custom-filter">' + | |
' <select ng-model="queryType">' + | |
' <option value="exact">Exact</option>' + | |
' <option value="between">Between</option>' + | |
' </select>' + | |
' <input ng-model="dateOne" type="date">' + | |
' <input ng-model="dateTwo" ng-show="queryType == \'between\'" type="date">' + | |
'</div>'; | |
function DateFilter () {} | |
DateFilter.prototype.init = function (params) { | |
this.valueGetter = params.valueGetter; | |
this.$scope = params.$scope; | |
this.$scope.queryType = 'exact'; | |
this.$scope.$watch('[queryType, dateOne, dateTwo]', params.filterChangedCallback); | |
}; | |
DateFilter.prototype.getGui = function () { | |
var element = document.createElement('div'); | |
element.innerHTML = template; | |
return element; | |
}; | |
DateFilter.prototype.isFilterActive = function () { | |
var scope = this.$scope; | |
if (scope.queryType == 'exact') { | |
return !!scope.dateOne; | |
} else if (scope.queryType == 'between') { | |
return !!scope.dateOne && !!scope.dateTwo; | |
} | |
return false; | |
}; | |
DateFilter.prototype.doesFilterPass = function (params) { | |
var scope = this.$scope; | |
var value = this.valueGetter(params.node); | |
if (scope.queryType == 'exact') { | |
return moment(value).isSame(scope.dateOne, 'day'); | |
} else if (scope.queryType == 'between') { | |
return moment(value).isBetween(scope.dateOne, scope.dateTwo); | |
} | |
}; | |
DateFilter.prototype.getApi = function () { | |
var scope = this.$scope; | |
return { | |
getModel: function() { | |
var model = { | |
dateOne: scope.dateOne, | |
dateTwo: scope.dateTwo, | |
queryType: scope.queryType | |
}; | |
return model; | |
}, | |
setModel: function(model) { | |
scope.dateOne = model.dateOne; | |
scope.dateTwo = model.dateTwo; | |
scope.queryType = model.queryType; | |
} | |
} | |
}; | |
module.exports = DateFilter; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@LuckyHRE @HaythemJ Thank you for pointing out the missing required method. I have added your snippet to the Gist.