diff --git a/superset/assets/javascripts/explorev2/actions/exploreActions.js b/superset/assets/javascripts/explorev2/actions/exploreActions.js index a026d9094bd4b..935fe23b8112d 100644 --- a/superset/assets/javascripts/explorev2/actions/exploreActions.js +++ b/superset/assets/javascripts/explorev2/actions/exploreActions.js @@ -93,6 +93,26 @@ export function changeFilter(filter, field, value) { return { type: CHANGE_FILTER, filter, field, value }; } +export function fetchFilterValues(datasource_type, datasource_id, filter, col) { + return function (dispatch) { + $.ajax({ + type: 'GET', + url: `/superset/filter/${datasource_type}/${datasource_id}/${col}/`, + success: (data) => { + dispatch(changeFilter( + filter, + 'choices', + Object.keys(data).map((k) => ([`'${data[k]}'`, `'${data[k]}'`])) + ) + ); + }, + error() { + dispatch(changeFilter(filter, 'choices', [])); + }, + }); + }; +} + export const SET_FIELD_VALUE = 'SET_FIELD_VALUE'; export function setFieldValue(datasource_type, key, value, label) { return { type: SET_FIELD_VALUE, datasource_type, key, value, label }; diff --git a/superset/assets/javascripts/explorev2/components/ControlPanelsContainer.jsx b/superset/assets/javascripts/explorev2/components/ControlPanelsContainer.jsx index 8b86791dd6647..02adb78a3c3e6 100644 --- a/superset/assets/javascripts/explorev2/components/ControlPanelsContainer.jsx +++ b/superset/assets/javascripts/explorev2/components/ControlPanelsContainer.jsx @@ -102,6 +102,7 @@ class ControlPanelsContainer extends React.Component { filters={this.props.form_data.filters} actions={this.props.actions} prefix={section.prefix} + datasource_id={this.props.form_data.datasource} /> ))} diff --git a/superset/assets/javascripts/explorev2/components/Filter.jsx b/superset/assets/javascripts/explorev2/components/Filter.jsx index ff6f38dd202b8..f0ba3182cf877 100644 --- a/superset/assets/javascripts/explorev2/components/Filter.jsx +++ b/superset/assets/javascripts/explorev2/components/Filter.jsx @@ -1,13 +1,16 @@ import React from 'react'; -// import { Tab, Row, Col, Nav, NavItem } from 'react-bootstrap'; import Select from 'react-select'; import { Button } from 'react-bootstrap'; +import SelectField from './SelectField'; const propTypes = { actions: React.PropTypes.object.isRequired, filterColumnOpts: React.PropTypes.array, prefix: React.PropTypes.string, filter: React.PropTypes.object.isRequired, + renderFilterSelect: React.PropTypes.bool, + datasource_type: React.PropTypes.string.isRequired, + datasource_id: React.PropTypes.number.isRequired, }; const defaultProps = { @@ -24,9 +27,22 @@ export default class Filter extends React.Component { opChoices, }; } + componentWillMount() { + if (this.props.filter.col) { + this.props.actions.fetchFilterValues( + this.props.datasource_type, + this.props.datasource_id, + this.props.filter, + this.props.filter.col); + } + } changeCol(filter, colOpt) { const val = (colOpt) ? colOpt.value : null; this.props.actions.changeFilter(filter, 'col', val); + if (val) { + this.props.actions.fetchFilterValues( + this.props.datasource_type, this.props.datasource_id, filter, val); + } } changeOp(filter, opOpt) { const val = (opOpt) ? opOpt.value : null; @@ -35,9 +51,35 @@ export default class Filter extends React.Component { changeValue(filter, event) { this.props.actions.changeFilter(filter, 'value', event.target.value); } + changeSelectValue(filter, name, value) { + this.props.actions.changeFilter(filter, 'value', value); + } removeFilter(filter) { this.props.actions.removeFilter(filter); } + renderFilterFormField() { + if (this.props.renderFilterSelect) { + return ( + + ); + } + return ( + + ); + } render() { return (
@@ -65,13 +107,7 @@ export default class Filter extends React.Component { onChange={this.changeOp.bind(this, this.props.filter)} />
- + {this.renderFilterFormField()}