Skip to content
This repository has been archived by the owner on Jan 15, 2022. It is now read-only.

Commit

Permalink
Allow to filter by column: value
Browse files Browse the repository at this point in the history
This Branch improves the way filterBy workes, by allowing it to be
set with and hash like {'Column': 'search query'} programatically.

Another improvement, that still needs to be touched is the ability to do
the same from the search box in a form of 'Column: search query' that will be
split by the ':' and use each side as column to filter, and value.
  • Loading branch information
jpserra committed Dec 16, 2015
1 parent 0acc184 commit 7ecfa5e
Show file tree
Hide file tree
Showing 8 changed files with 453 additions and 2,389 deletions.
1 change: 0 additions & 1 deletion Gruntfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -131,4 +131,3 @@ module.exports = function(grunt) {
grunt.registerTask('build', ['babel:common', 'buildBrowser']);
grunt.registerTask('default', ['build', 'watch:build']);
};

106 changes: 90 additions & 16 deletions build/reactable.js
Original file line number Diff line number Diff line change
Expand Up @@ -239,10 +239,20 @@ window.ReactDOM["default"] = window.ReactDOM;
}, {
key: 'render',
value: function render() {
var value = '';
if (typeof this.props.value != 'string') {
for (var key in this.props.value) {
value += key + ': ' + this.props.value[key] + ', ';
}
value = value.slice(0, -2);
} else {
value = this.props.value;
}
value = value.trim();
return _react['default'].createElement('input', { type: 'text',
className: 'reactable-filter-input',
placeholder: this.props.placeholder,
value: this.props.value,
value: value,
onKeyUp: this.onChange.bind(this),
onChange: this.onChange.bind(this) });
}
Expand Down Expand Up @@ -1204,24 +1214,90 @@ window.ReactDOM["default"] = window.ReactDOM;
}, {
key: 'applyFilter',
value: function applyFilter(filter, children) {
// Helper function to apply filter text to a list of table rows
filter = filter.toLowerCase();
var matchedChildren = [];
if (typeof filter === 'string') {
// Helper function to apply filter text to a list of table rows
filter = filter.toLowerCase();
var matchedChildren = [];

for (var i = 0; i < children.length; i++) {
var data = children[i].props.data;
for (var i = 0; i < children.length; i++) {
var data = children[i].props.data;

for (var j = 0; j < this.props.filterable.length; j++) {
var filterColumn = this.props.filterable[j];
for (var j = 0; j < this.props.filterable.length; j++) {
var filterColumn = this.props.filterable[j];

if (typeof data[filterColumn] !== 'undefined' && (0, _libExtract_data_from.extractDataFrom)(data, filterColumn).toString().toLowerCase().indexOf(filter) > -1) {
matchedChildren.push(children[i]);
break;
if (typeof data[filterColumn] !== 'undefined' && (0, _libExtract_data_from.extractDataFrom)(data, filterColumn).toString().toLowerCase().indexOf(filter) > -1) {
matchedChildren.push(children[i]);
break;
}
}
}

return matchedChildren;
} else {
var _ret = (function () {

var filterCount = Object.keys(filter).length;
var matchedChildren = [];

for (var filterColumn in filter) {
var val = filter[filterColumn].toLowerCase();
for (var i = 0; i < children.length; i++) {
var data = children[i].props.data;
if (typeof data[filterColumn] !== 'undefined' && (0, _libExtract_data_from.extractDataFrom)(data, filterColumn).toString().toLowerCase().indexOf(val) > -1) {
matchedChildren.push(children[i]);
}
}
}

if (filterCount > 1) {
var result = [];
return {
v: matchedChildren.map(function (children) {
var occurrences = matchedChildren.filter(function (value) {
return value.key === children.key;
}).length;
if (occurrences == filterCount) {
return children;
}
})
};
} else {
return {
v: matchedChildren
};
}
})();

if (typeof _ret === 'object') return _ret.v;
}
}
}, {
key: 'onFilter',
value: function onFilter(filters) {
if (typeof filters === 'string' && filters.indexOf(':') != -1) {
(function () {
var filterObj = {};
filters = filters.trim();
var col = '';
var val = '';
filters = filters.split(',');

filters.map(function (filter) {
filter = filter.split(':');
if (filter[0]) {
col = filter[0].trim();
}
if (filter[1]) {
val = filter[1].trim();
}
filterObj[col] = val;
});

filters = filterObj;
})();
}

return matchedChildren;
this.setState({ filter: filters });
}
}, {
key: 'sortByCurrentSort',
Expand Down Expand Up @@ -1284,7 +1360,7 @@ window.ReactDOM["default"] = window.ReactDOM;
this.setState({ currentSort: currentSort });
this.sortByCurrentSort();

if (this.props.onSort) {
if (typeof this.props.onSort === 'function') {
this.props.onSort(currentSort);
}
}
Expand Down Expand Up @@ -1410,9 +1486,7 @@ window.ReactDOM["default"] = window.ReactDOM;
props,
columns && columns.length > 0 ? _react['default'].createElement(_thead.Thead, { columns: columns,
filtering: filtering,
onFilter: function (filter) {
_this.setState({ filter: filter });
},
onFilter: this.onFilter.bind(this),
filterPlaceholder: this.props.filterPlaceholder,
currentFilter: this.state.filter,
sort: this.state.currentSort,
Expand Down
Loading

0 comments on commit 7ecfa5e

Please sign in to comment.