Fetching server-side data shouldn't require a default about table HOT 10 CLOSED

I'm not sure I understand the columns={columns} jsx you have in the
callback?
On Thu, Oct 27, 2016 at 4:57 PM Alex Simoes [email protected]
wrote:

I'm trying to use the server-side data example which will work until I add
a setTimeout and then I get a few console errors. Here's the sample code:

Works --

const data = [{name:'test', id:1234}];return (

{ callback({ rows:data }) }} />

)

Doesn't work --

const data = [{name:'test', id:1234}];return (

{ setTimeout(() => { callback({ rows:data }) }) }} />

)

The second test will work if initialized with the callback like so:

const data = [{name:'test', id:1234}];return (

{ columns={columns} setTimeout(() => { callback({ rows:data }) }) }} />

)

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
#6, or mute the
thread
https://github.com/notifications/unsubscribe-auth/AFUmCZXkljtUZiUcMIEKdF62S6JAL4K4ks5q4SxVgaJpZM4Ki6ap
.

from table.

Woops, sorry that was a copy/paste error, the last, working example should've been this:

const data  = [{name:'test', id:1234}];
return (
  <div>
    <ReactTable
      pageSize={10}
      columns={columns}
      data={(params, callback) => {
        callback({ rows:[] })
        setTimeout(() => {
          callback({ rows:data })
        })
      }}
    />
  </div>
)

from table.

I'll look into this tomorrow. Very interesting
On Fri, Oct 28, 2016 at 10:34 AM Alex Simoes [email protected]
wrote:

Woops, sorry that was a copy/paste error, the last, working example
should've been this:

const data = [{name:'test', id:1234}];return (

{
callback({ rows:[] })

setTimeout(() => {
callback({ rows:data })
})
}}
/>

)

—
You are receiving this because you commented.

Reply to this email directly, view it on GitHub
#6 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFUmCdX3qElFwND8YDEwjdzJMa4LD6hDks5q4iQfgaJpZM4Ki6ap
.

from table.

I can confirm, I'm running into the same issue as well.

Additionally, the page property seems to get all out of whack. Pages one and two pass me 1, while page three passes me 2.

from table.

Just released 3.0.0. Did you have a look at the new server side section?
On Mon, Oct 31, 2016 at 1:54 AM Nicholas Paldino [email protected]
wrote:

I can confirm, I'm running into the same issue as well.

—
You are receiving this because you commented.

Reply to this email directly, view it on GitHub
#6 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFUmCSaj8g8GXNj4qAZCI6P-QzXeoe9Nks5q5Z7CgaJpZM4Ki6ap
.

from table.

The way data is fetched in the latest version should fix this issue. You can now listen for table changes and handle the data updates yourself via component state or redux or any other dynamic react state.

from table.

The way data is fetched in the latest version should fix this issue. You can now listen for table changes and handle the data updates yourself via component state or redux or any other dynamic react state.

Do you have an example of this?

When using a callback, I'm getting this.props.data.map is not a function:

In this case, this.props.data is the callback function.

Here's the code that I have for react-table:

<ReactTable
  data={ (params, callback) => {
      // If no URL, then just get out.
      if (!challongeUrl) return Promise.resolve({ rows: [] });

      return fetchUtilities.fetchApi({
        url: `/api/challonge/tournaments?url=${ encodeURIComponent(challongeUrl) }&page=${ params.page }`
      }).then(data => {
        return {
          pages: data.pages,
          rows: data.tournaments
        }
      })
    }
  }
  columns={[
    {
      accessor: 'name',
      name: 'Name'
    },
    {
      accessor: 'game',
      name: 'Game'
    },
    {
      accessor: 'type',
      name: 'Bracket Type'
    },
    {
      accessor: 'progress',
      name: '% Complete',
      render: ({ value, rowValues, row, index, viewIndex}) => <LinearProgress mode='determinate' value={ value }/>
    }
  ]}
/>

I've validated that my service is returning the data correctly.

from table.

Update to the latest version and follow these steps
https://github.com/tannerlinsley/react-table/#server-side-data
On Mon, Oct 31, 2016 at 2:25 AM Nicholas Paldino [email protected]
wrote:

The way data is fetched in the latest version should fix this issue. You
can now listen for table changes and handle the data updates yourself via
component state or redux or any other dynamic react state.

Do you have an example of this?

When using a callback, I'm getting this.props.data.map is not a function:

[image: image]
https://cloud.githubusercontent.com/assets/561862/19848138/cf43d398-9f21-11e6-9b4e-147545454371.png

In this case, this.props.data is the callback function.

Here's the code that I have for react-table:

<ReactTable
data={ (params, callback) => {
// If no URL, then just get out.
if (!challongeUrl) return Promise.resolve({ rows: [] });

  return fetchUtilities.fetchApi({
    url: `/api/challonge/tournaments?url=${ encodeURIComponent(challongeUrl) }&page=${ params.page }`
  }).then(data => {
    return {
      pages: data.pages,
      rows: data.tournaments
    }
  })
}

}
columns={[
{
accessor: 'name',
name: 'Name'
},
{
accessor: 'game',
name: 'Game'
},
{
accessor: 'type',
name: 'Bracket Type'
},
{
accessor: 'progress',
name: '% Complete',
render: ({ value, rowValues, row, index, viewIndex}) => <LinearProgress mode='determinate' value={ value }/>
}
]}
/>

I've validated that my service is returning the data correctly.

—
You are receiving this because you commented.

Reply to this email directly, view it on GitHub
#6 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFUmCcnbjaiI19Gjidr-jKyB6CYGYrLtks5q5aX4gaJpZM4Ki6ap
.

from table.

That seems to do it, thanks!

I'm having an issue where all the data is being rendered as &nbsp but that's for me to figure out another day.

from table.

@casperOne If minRows is set to anything > 0, placeholder rows are inserted into the table that contain  . My guess is your data is empty or something similar. If you still have that problem, create a new issue and we'll handle it there :)

from table.