Merge pull request #185 from frontsideair/indeterminate

Add indeterminate status to select all checkbox

src/BootstrapTable.js

@@ -227,9 +227,9 @@ class BootstrapTable extends React.Component {
     var defaultSelectRowKeys = this.store.getSelectedRowKeys();
     var allRowKeys = this.store.getAllRowkey();
     if(defaultSelectRowKeys.length !== allRowKeys.length){
-      return false;
+      return defaultSelectRowKeys.length === 0 ? false : 'indeterminate';
     } else {
-      return defaultSelectRowKeys.every(elm => allRowKeys.indexOf(elm)>-1);
+      return true;
     }
   }
 

src/TableHeader.js

@@ -1,9 +1,22 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import Const from './Const';
 import Util from './util';
 import classSet from 'classnames';
 import SelectRowHeaderColumn from './SelectRowHeaderColumn';
 
+class Checkbox extends React.Component{
+  componentDidMount() { this.update(this.props.checked); }
+  componentWillReceiveProps(props) { this.update(props.checked); }
+  update(checked) {
+    ReactDOM.findDOMNode(this).indeterminate = checked === 'indeterminate';
+  }
+
+  render() {
+    return <input type="checkbox" checked={this.props.checked} onChange={this.props.onChange} />
+  }
+}
+
 class TableHeader extends React.Component{
 
   constructor(props) {
@@ -65,7 +78,7 @@ class TableHeader extends React.Component{
       return (<SelectRowHeaderColumn width={this.selectRowColumnWidth}></SelectRowHeaderColumn>);
     }else if(this.props.rowSelectType == Const.ROW_SELECT_MULTI){
       return (<SelectRowHeaderColumn width={this.selectRowColumnWidth}>
-          <input type="checkbox" onChange={this.props.onSelectAllRow} checked={this.props.isSelectAll}/>
+          <Checkbox onChange={this.props.onSelectAllRow} checked={this.props.isSelectAll}/>
         </SelectRowHeaderColumn>
       );
     }else{
@@ -113,7 +126,7 @@ TableHeader.propTypes = {
   hideSelectColumn: React.PropTypes.bool,
   bordered: React.PropTypes.bool,
   condensed: React.PropTypes.bool,
-  isSelectAll: React.PropTypes.bool
+  isSelectAll: React.PropTypes.oneOf([true, 'indeterminate', false])
 };
 
 TableHeader.defaultProps = {