Skip to content

Commit

Permalink
Merge pull request #726 from marmelab/filter_transform
Browse files Browse the repository at this point in the history 
[RFR] Make Field.transform() work on filters
  • Loading branch information
@fzaninotto
fzaninotto committed Oct 9, 2015
2 parents 4bbf48c + 2070d0a commit b8cea76
Show file tree
Hide file tree
Showing 2 changed files with 29 additions and 14 deletions.
14 changes: 8 additions & 6 deletions examples/blog/config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
return { params: params };
});

RestangularProvider.addResponseInterceptor(function(data, operation, what, url, response, deferred) {
RestangularProvider.addResponseInterceptor(function(data, operation, what, url, response) {
if (operation === "getList") {
var headers = response.headers();
if (headers['content-range']) {
Expand Down Expand Up @@ -101,7 +101,7 @@
.targetEntity(tag) // the tag entity is defined later in this file
.targetField(nga.field('name')) // the field to be displayed in this list
.cssClasses('hidden-xs')
.singleApiCall(ids => { return {'id': ids }})
.singleApiCall(ids => { return {'id': ids }; })
])
.filters([
nga.field('category', 'choice').choices([
Expand Down Expand Up @@ -193,13 +193,15 @@
.targetEntity(post)
.targetField(nga.field('title').map(truncate))
.cssClasses('hidden-xs')
.singleApiCall(ids => { return {'id': ids }})
.singleApiCall(ids => { return {'id': ids }; })
])
.filters([
nga.field('q')
.label('')
.pinned(true)
.template('<div class="input-group"><input type="text" ng-model="value" placeholder="Search" class="form-control"></input><span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span></div>'),
.template('<div class="input-group"><input type="text" ng-model="value" placeholder="Search" class="form-control"></input><span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span></div>')
.transform(v => v && v.toUpperCase()) // transform the entered value before sending it as a query parameter
.map(v => v && v.toLowerCase()), // map the query parameter to a displayed value in the filter form
nga.field('created_at', 'date')
.label('Posted')
.attributes({'placeholder': 'Filter by date'}),
Expand Down Expand Up @@ -279,7 +281,7 @@
nga.field('published', 'boolean').validation({
required: true // as this boolean is required, ng-admin will use a checkbox instead of a dropdown
})
])
]);

tag.showView()
.fields([
Expand Down Expand Up @@ -410,7 +412,7 @@
template: '<p class="form-control-static"><a ng-click="displayPost()">View&nbsp;post</a></p>',
link: function (scope) {
scope.displayPost = function () {
$location.path('/posts/show/' + scope.entry().values.post_id);
$location.path('/posts/show/' + scope.entry().values.post_id); // jshint ignore:line
};
}
};
Expand Down
29 changes: 21 additions & 8 deletions src/javascripts/ng-admin/Crud/list/ListLayoutController.js
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
/* globals _ */

var ListLayoutController = function ($scope, $stateParams, $state, $location, $timeout, view, dataStore) {
this.$scope = $scope;
this.$state = $state;
Expand All @@ -9,15 +11,16 @@ var ListLayoutController = function ($scope, $stateParams, $state, $location, $t
this.actions = view.actions();
this.batchActions = view.batchActions();
this.loadingPage = false;
this.search = $location.search().search ? JSON.parse($location.search().search) : {};
this.filters = view.filters();
this.search = getCurrentSearchParam($location, this.filters);
// since search isn't a $stateParam of the listLayout state,
// the controller doesn't change when the search changes
// so we must update filter values manually when the location changes
$scope.$watch(
() => $location.search() && $location.search().search ,
(newval, oldval) => {
if (newval === oldval) return;
this.search = $location.search().search ? JSON.parse($location.search().search) : {};
this.search = getCurrentSearchParam($location, this.filters);
this.enabledFilters = this.getEnabledFilters();
}
);
Expand Down Expand Up @@ -46,25 +49,35 @@ var ListLayoutController = function ($scope, $stateParams, $state, $location, $t
$scope.$on('$destroy', this.destroy.bind(this));
};

function getCurrentSearchParam(location, filters) {
let search = location.search().search ? JSON.parse(location.search().search) : {};
filters.map(filter => {
if (search[filter.name()]) {
search[filter.name()] = filter.getMappedValue(search[filter.name()]);
}
});
return search;
}

ListLayoutController.prototype.enableFilter = function (filter) {
let defaultValue = filter.defaultValue();
if (defaultValue !== null) {
this.search[filter.name()] = defaultValue;
}
this.enabledFilters.push(filter)
this.enabledFilters.push(filter);
this.focusedFilterId = filter.name();
this.$timeout(() => {
let el = window.document.getElementById(this.focusedFilterId);
el && el.focus && el.focus();
if (el && el.focus) el.focus();
}, 200, false);
}
};

ListLayoutController.prototype.getEnabledFilters = function () {
return this.filters.filter(filter => {
if (filter.pinned()) return true;
return this.search && (filter.name() in this.search)
return this.search && (filter.name() in this.search);
});
}
};

ListLayoutController.prototype.updateFilters = function () {
var values = {},
Expand All @@ -82,7 +95,7 @@ ListLayoutController.prototype.updateFilters = function () {

if ((field.type() === 'boolean' && this.search[fieldName]) || // for boolean false is the same as null
(field.type() !== 'boolean' && this.search[fieldName] !== null)) {
values[fieldName] = this.search[fieldName];
values[fieldName] = field.getTransformedValue(this.search[fieldName]);
}
}
this.$stateParams.search = values;
Expand Down

0 comments on commit b8cea76

Please sign in to comment.