Fixes to infinite scroll

erfangc · May 21, 2015 · 931dfba · 931dfba
1 parent 76ebb1f
commit 931dfba
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 23 deletions.
diff --git a/build/ReactTable.js b/build/ReactTable.js
@@ -219,12 +219,12 @@ var ReactTable = React.createClass({displayName: 'ReactTable',
         var upperBound = (this.state.rowMultiplier + 1) * this.state.itemsPerScroll;
         var rowsToDisplay = [];
 
-        if( this.state.rows.length < upperBound ) {
+        if( this.state.rows.length < upperBound && this.state.rows.length < rasterizedData.length ) {
             var lowerBound = this.state.rowMultiplier * this.state.itemsPerScroll;
             rowsToDisplay = rasterizedData.slice(lowerBound, upperBound);
             this.state.rows = this.state.rows.concat(rowsToDisplay.map(rowMapper, this));
         }
-        else{
+        else {
             rowsToDisplay = rasterizedData.slice(0, upperBound);
             this.state.rows = rowsToDisplay.map(rowMapper, this);
         }
@@ -257,15 +257,13 @@ var ReactTable = React.createClass({displayName: 'ReactTable',
         if (this.props.disableScrolling)
             containerStyle.overflowY = "hidden";
 
-        console.log(this.state.rows.length);
         return (
             React.DOM.div({id: this.state.uniqueId, className: "rt-table-container"}, 
                 headers, 
                 React.DOM.div({style: containerStyle, className: "rt-scrollable"}, 
                     InfiniteScroll({
                         loadMore: this.addMoreRows, 
-                        hasMore: this.state.hasMore, 
-                        loader: React.DOM.div({className: "loader"}, "Loading ...")}, 
+                        hasMore: this.state.hasMore}, 
                         React.DOM.table({className: "rt-table"}, 
                             React.DOM.tbody(null, 
                                 this.state.rows
@@ -311,7 +309,7 @@ var Row = React.createClass({displayName: 'Row',
             'summary-selected': this.props.isSelected && !this.props.data.isDetail
         });
         var styles = {
-            "cursor": this.props.data.isDetail ? "pointer" : "inherit"
+            "cursor": "pointer"
         };
         for (var attrname in this.props.extraStyle) {
             styles[attrname] = this.props.extraStyle[attrname];

diff --git a/dist/react-table.js b/dist/react-table.js
@@ -933,12 +933,12 @@ var ReactTable = React.createClass({displayName: 'ReactTable',
         var upperBound = (this.state.rowMultiplier + 1) * this.state.itemsPerScroll;
         var rowsToDisplay = [];
 
-        if( this.state.rows.length < upperBound ) {
+        if( this.state.rows.length < upperBound && this.state.rows.length < rasterizedData.length ) {
             var lowerBound = this.state.rowMultiplier * this.state.itemsPerScroll;
             rowsToDisplay = rasterizedData.slice(lowerBound, upperBound);
             this.state.rows = this.state.rows.concat(rowsToDisplay.map(rowMapper, this));
         }
-        else{
+        else {
             rowsToDisplay = rasterizedData.slice(0, upperBound);
             this.state.rows = rowsToDisplay.map(rowMapper, this);
         }
@@ -971,15 +971,13 @@ var ReactTable = React.createClass({displayName: 'ReactTable',
         if (this.props.disableScrolling)
             containerStyle.overflowY = "hidden";
 
-        console.log(this.state.rows.length);
         return (
             React.DOM.div({id: this.state.uniqueId, className: "rt-table-container"}, 
                 headers, 
                 React.DOM.div({style: containerStyle, className: "rt-scrollable"}, 
                     InfiniteScroll({
                         loadMore: this.addMoreRows, 
-                        hasMore: this.state.hasMore, 
-                        loader: React.DOM.div({className: "loader"}, "Loading ...")}, 
+                        hasMore: this.state.hasMore}, 
                         React.DOM.table({className: "rt-table"}, 
                             React.DOM.tbody(null, 
                                 this.state.rows
@@ -1025,7 +1023,7 @@ var Row = React.createClass({displayName: 'Row',
             'summary-selected': this.props.isSelected && !this.props.data.isDetail
         });
         var styles = {
-            "cursor": this.props.data.isDetail ? "pointer" : "inherit"
+            "cursor": "pointer"
         };
         for (var attrname in this.props.extraStyle) {
             styles[attrname] = this.props.extraStyle[attrname];

diff --git a/dist/react-table.min.js b/dist/react-table.min.js
diff --git a/examples/exporting_demo.js b/examples/exporting_demo.js
@@ -68,9 +68,9 @@ $(function () {
             },
             data: testData,
             onRightClick: function (row, event) {
-                console.log(row);
-                console.log(state);
                 event.preventDefault();
+                console.log(row);
+                console.log(event);
                 //alert("sweet right click on id " + row.id + "!");
             },
             height: "300px",
@@ -89,7 +89,6 @@ $(function () {
             onSummarySelectCallback: function (result, state) {
                 console.log(result);
                 console.log(state);
-                console.log("Includes " + result.detailRows.length + " detail rows! state:" + state);
             }
         };
         var table1 = React.render(React.createElement(ReactTable, options), document.getElementById("table"));

diff --git a/src/ReactTable.js b/src/ReactTable.js
@@ -219,12 +219,12 @@ var ReactTable = React.createClass({
         var upperBound = (this.state.rowMultiplier + 1) * this.state.itemsPerScroll;
         var rowsToDisplay = [];
 
-        if( this.state.rows.length < upperBound ) {
+        if( this.state.rows.length < upperBound && this.state.rows.length < rasterizedData.length ) {
             var lowerBound = this.state.rowMultiplier * this.state.itemsPerScroll;
             rowsToDisplay = rasterizedData.slice(lowerBound, upperBound);
             this.state.rows = this.state.rows.concat(rowsToDisplay.map(rowMapper, this));
         }
-        else{
+        else {
             rowsToDisplay = rasterizedData.slice(0, upperBound);
             this.state.rows = rowsToDisplay.map(rowMapper, this);
         }
@@ -257,15 +257,13 @@ var ReactTable = React.createClass({
         if (this.props.disableScrolling)
             containerStyle.overflowY = "hidden";
 
-        console.log(this.state.rows.length);
         return (
             <div id={this.state.uniqueId} className="rt-table-container">
                 {headers}
                 <div style={containerStyle} className="rt-scrollable">
                     <InfiniteScroll
                         loadMore={this.addMoreRows}
-                        hasMore={this.state.hasMore}
-                        loader={<div className="loader">Loading ...</div>}>
+                        hasMore={this.state.hasMore}>
                         <table className="rt-table">
                             <tbody>
                                 {this.state.rows}
@@ -311,7 +309,7 @@ var Row = React.createClass({
             'summary-selected': this.props.isSelected && !this.props.data.isDetail
         });
         var styles = {
-            "cursor": this.props.data.isDetail ? "pointer" : "inherit"
+            "cursor": "pointer"
         };
         for (var attrname in this.props.extraStyle) {
             styles[attrname] = this.props.extraStyle[attrname];