diff --git a/build/Griddle.js b/build/Griddle.js
index cc4e1d59..28b04f0f 100644
--- a/build/Griddle.js
+++ b/build/Griddle.js
@@ -815,7 +815,7 @@ return /******/ (function(modules) { // webpackBootstrap
 	        };
 	    },
 	    getFilter: function getFilter() {
-	        return this.props.showFilter && this.shouldUseCustomGridComponent() === false ? this.props.useCustomFilterComponent ? React.createElement(CustomFilterContainer, { changeFilter: this.setFilter, placeholderText: this.props.filterPlaceholderText, customFilterComponent: this.props.customFilterComponent, results: this.props.results, currentResults: this.getCurrentResults() }) : React.createElement(GridFilter, { changeFilter: this.setFilter, placeholderText: this.props.filterPlaceholderText }) : "";
+	        return this.props.showFilter && this.shouldUseCustomGridComponent() === false ? this.props.useCustomFilterComponent ? React.createElement(CustomFilterContainer, { customFilterComponentOptions: this.props.customFilterComponentOptions, changeFilter: this.setFilter, placeholderText: this.props.filterPlaceholderText, customFilterComponent: this.props.customFilterComponent, results: this.props.results, currentResults: this.getCurrentResults() }) : React.createElement(GridFilter, { changeFilter: this.setFilter, placeholderText: this.props.filterPlaceholderText }) : "";
 	    },
 	    getSettings: function getSettings() {
 	        return this.props.showSettings ? React.createElement('button', { type: 'button', className: this.props.settingsToggleClassName, onClick: this.toggleColumnChooser,
@@ -8010,6 +8010,16 @@ return /******/ (function(modules) { // webpackBootstrap
 	*/
 	"use strict";
 
+	var _extends = Object.assign || function (target) {
+	  for (var i = 1; i < arguments.length; i++) {
+	    var source = arguments[i];for (var key in source) {
+	      if (Object.prototype.hasOwnProperty.call(source, key)) {
+	        target[key] = source[key];
+	      }
+	    }
+	  }return target;
+	};
+
 	var React = __webpack_require__(2);
 
 	var CustomFilterContainer = React.createClass({
@@ -8017,7 +8027,8 @@ return /******/ (function(modules) { // webpackBootstrap
 
 	  getDefaultProps: function getDefaultProps() {
 	    return {
-	      "placeholderText": ""
+	      "placeholderText": "",
+	      "customFilterComponentOptions": {}
 	    };
 	  },
 	  render: function render() {
@@ -8028,11 +8039,11 @@ return /******/ (function(modules) { // webpackBootstrap
 	      return React.createElement("div", null);
 	    }
 
-	    return React.createElement(that.props.customFilterComponent, {
+	    return React.createElement(that.props.customFilterComponent, _extends({}, this.props.customFilterComponentOptions, {
 	      changeFilter: this.props.changeFilter,
 	      results: this.props.results,
 	      currentResults: this.props.currentResults,
-	      placeholderText: this.props.placeholderText });
+	      placeholderText: this.props.placeholderText }));
 	  }
 	});
 
diff --git a/docs/src/markdown/customization.md b/docs/src/markdown/customization.md
index e5faf3fb..a8d3113f 100644
--- a/docs/src/markdown/customization.md
+++ b/docs/src/markdown/customization.md
@@ -445,6 +445,21 @@ var TestLineChart = React.createClass({
 
 Griddle supports custom filtering and custom filter components. In order to use a custom filter function set the property `useCustomFilterer` to true and pass in a function to the  `customFilterer` property. To use a custom filter component set `useCustomFilterComponent` to true and pass a component to `customFilterComponent`.
 
+<dl>
+  <dt>useCustomFilterComponent</dt>
+  <dd><strong>bool</strong> - Use custom filter component rather than default filter. default: false</dd>
+</dl>
+
+<dl>
+  <dt>customFilterComponent</dt>
+  <dd><strong>object</strong> - The custom filter component. default: {}</dd>
+</dl>
+
+<dl>
+  <dt>customFilterComponentOptions</dt>
+  <dd><strong>object</strong> - Any options to be passed to the custom filter component. default: {}</dd>
+</dl>
+
 #####Example:#####
 
 This example shows how to make a custom filter component with a custom filter function that does a case-insensitive search through the items. The component must call `this.props.changeFilter(val)` when the filter should be updated. In the example below we pass a string but any variable type can be used as long as the filter function is expecting it, for example an advanced query could be passed in using an object. The filter function signature takes the items to be filtered and the query to filter them by.
diff --git a/modules/customFilterContainer.jsx.js b/modules/customFilterContainer.jsx.js
index 8cd59a1b..d2e59dc1 100644
--- a/modules/customFilterContainer.jsx.js
+++ b/modules/customFilterContainer.jsx.js
@@ -3,6 +3,16 @@
 */
 "use strict";
 
+var _extends = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }return target;
+};
+
 var React = require('react');
 
 var CustomFilterContainer = React.createClass({
@@ -10,7 +20,8 @@ var CustomFilterContainer = React.createClass({
 
   getDefaultProps: function getDefaultProps() {
     return {
-      "placeholderText": ""
+      "placeholderText": "",
+      "customFilterComponentOptions": {}
     };
   },
   render: function render() {
@@ -21,11 +32,11 @@ var CustomFilterContainer = React.createClass({
       return React.createElement("div", null);
     }
 
-    return React.createElement(that.props.customFilterComponent, {
+    return React.createElement(that.props.customFilterComponent, _extends({}, this.props.customFilterComponentOptions, {
       changeFilter: this.props.changeFilter,
       results: this.props.results,
       currentResults: this.props.currentResults,
-      placeholderText: this.props.placeholderText });
+      placeholderText: this.props.placeholderText }));
   }
 });
 
diff --git a/modules/griddle.jsx.js b/modules/griddle.jsx.js
index ca230e3e..096c7641 100644
--- a/modules/griddle.jsx.js
+++ b/modules/griddle.jsx.js
@@ -247,7 +247,6 @@ var Griddle = React.createClass({
             this.props.externalSetPageSize(size);
             return;
         }
-
         //make this better.
         this.state.resultsPerPage = size;
         this.setMaxPage();
@@ -750,7 +749,7 @@ var Griddle = React.createClass({
         };
     },
     getFilter: function getFilter() {
-        return this.props.showFilter && this.shouldUseCustomGridComponent() === false ? this.props.useCustomFilterComponent ? React.createElement(CustomFilterContainer, { changeFilter: this.setFilter, placeholderText: this.props.filterPlaceholderText, customFilterComponent: this.props.customFilterComponent, results: this.props.results, currentResults: this.getCurrentResults() }) : React.createElement(GridFilter, { changeFilter: this.setFilter, placeholderText: this.props.filterPlaceholderText }) : "";
+        return this.props.showFilter && this.shouldUseCustomGridComponent() === false ? this.props.useCustomFilterComponent ? React.createElement(CustomFilterContainer, { customFilterComponentOptions: this.props.customFilterComponentOptions, changeFilter: this.setFilter, placeholderText: this.props.filterPlaceholderText, customFilterComponent: this.props.customFilterComponent, results: this.props.results, currentResults: this.getCurrentResults() }) : React.createElement(GridFilter, { changeFilter: this.setFilter, placeholderText: this.props.filterPlaceholderText }) : "";
     },
     getSettings: function getSettings() {
         return this.props.showSettings ? React.createElement('button', { type: 'button', className: this.props.settingsToggleClassName, onClick: this.toggleColumnChooser,
diff --git a/scripts/customFilterContainer.jsx b/scripts/customFilterContainer.jsx
index bca28b8a..f0c42ac6 100644
--- a/scripts/customFilterContainer.jsx
+++ b/scripts/customFilterContainer.jsx
@@ -6,7 +6,8 @@ var React = require('react');
 var CustomFilterContainer = React.createClass({
   getDefaultProps: function(){
     return {
-      "placeholderText": ""
+      "placeholderText": "",
+      "customFilterComponentOptions": {}
     }
   },
   render: function(){
@@ -18,6 +19,7 @@ var CustomFilterContainer = React.createClass({
       }
 
       return <that.props.customFilterComponent
+        {...this.props.customFilterComponentOptions}
         changeFilter={this.props.changeFilter}
         results={this.props.results}
         currentResults={this.props.currentResults}
diff --git a/scripts/griddle.jsx b/scripts/griddle.jsx
index f3318bbc..6018ce47 100755
--- a/scripts/griddle.jsx
+++ b/scripts/griddle.jsx
@@ -760,7 +760,7 @@ var Griddle = React.createClass({
     getFilter: function(){
      return ((this.props.showFilter && this.shouldUseCustomGridComponent() === false) ?
         ( this.props.useCustomFilterComponent ?
-         <CustomFilterContainer changeFilter={this.setFilter} placeholderText={this.props.filterPlaceholderText} customFilterComponent={this.props.customFilterComponent} results={this.props.results} currentResults={this.getCurrentResults()} /> :
+         <CustomFilterContainer customFilterComponentOptions={this.props.customFilterComponentOptions} changeFilter={this.setFilter} placeholderText={this.props.filterPlaceholderText} customFilterComponent={this.props.customFilterComponent} results={this.props.results} currentResults={this.getCurrentResults()} /> :
          <GridFilter changeFilter={this.setFilter} placeholderText={this.props.filterPlaceholderText} />) :
         "");
     },