Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Uncaught TypeError: onPageChange is not a function #1735

Open
danielsann99 opened this issue Jun 4, 2021 · 23 comments
Open

Uncaught TypeError: onPageChange is not a function #1735

danielsann99 opened this issue Jun 4, 2021 · 23 comments

Comments

@danielsann99
Copy link

Hi,

In my table when I switch pages and rows it doesn't work

At the moment of rendering the content of the table is present, even the functions are all functional, outside the page switch and the selection of the rows to be displayed.

console error{
Warning: Failed prop type: The prop onPageChange is marked as required in ForwardRef(TablePagination), but its value is undefined
}

console error{
Warning: Unknown event handler property onChangePage. It will be ignored.
}

console error{
index.js:1 Warning: Unknown event handler property onChangeRowsPerPage. It will be ignored.
}

at each click of the icon to change the page or select the lines to be displayed, the following error is printed in the console

Uncaught TypeError: onPageChange is not a function.


here is my code..

const columns = [

{
    name: "id",
    label: "ID",
    
},
{
    name: "createdAt",
    label: "Data",
    options: {
        filter: true,
        sort: true,
    }
},
{
    name: "dest_nominativo",
    label: "Destinatario",
    options: {
        filter: true,
        sort: true,
    }
},
];






const options = {
    filter: true,
    filterType: "dropdown",

    customToolbarSelect: (data, item) => {
        return (
            <div style={{paddingRight:10}}>
                <Button type="submit" variant='outlined' color='primary'
                    onClick={() => {
                        calcoloArrayID(data)
                    }}>
                    Convalida
            </Button>
            </div>
        )
    },
    onChangeRowsPerPage: (data) => {
       
    },
    onRowSelectionChange: (data) => {
       
    },

    onRowClick: (data) => {
        history.push({ pathname: '/customer/dashboard/spedizione', state: { code: 1, id: data[0] } });
    }
};
                 <MUIDataTable
                        title={"title"}
                        data={data}
                        columns={columns}   
                        options={options}
                       />    

-->

|--------------|---------|
| Material-UI |
| MUI-datatables | 3.7.7 |
| React | js |
| browser | chrome/safari |
| etc | |

@danielsann99
Copy link
Author

Hello,
I tried to reproduce the error with code sandbox, the error arises only when I install the dependencies:
"@ emotion / react": "^ 11.4.0",
"@ emotion / styled": "^ 11.3.0",

I leave you the sandbox link here, you can notice that the selection of the lines remains does not work.

---> https://codesandbox.io/s/sparkling-wind-dtji1?file=/src/App.js:0-1977

@davlasry
Copy link

I have had the same issue

@shubhankar30
Copy link

Same issue here

@igor-pavlichenko
Copy link

It has to do with @material-ui v5, they changed the names of those props and in latest versions completely deprecated them.

Relates to #1747

@emekaokoli
Copy link

How do we solve this? I even downgrade @material-ui to v4 but the error persisted.

@IBonkI
Copy link

IBonkI commented Sep 2, 2021

How do we solve this? I even downgrade @material-ui to v4 but the error persisted.

Wait for this to get into new Version #1748 (comment)

@crgaurav
Copy link

+1

3 similar comments
@BiancaArtola
Copy link

+1

@aliammaar
Copy link

+1

@harikautilya
Copy link

+1

@Castalia-cong
Copy link

I got the error in fuse react mui-data table.
Uncaught TypeError: onChangePage is not a function

@Castalia-cong
Copy link

I expect the solution of this error

@romaincoeur
Copy link

+1

@emanuel-maker
Copy link

+3

@epotvin
Copy link

epotvin commented Dec 15, 2021

+1

6 similar comments
@MichaelBalla
Copy link

+1

@ranfysvalle02
Copy link

+1

@SuryaTeja-koka
Copy link

+1

@kamauge
Copy link

kamauge commented Mar 23, 2022

+1

@BibhushanKarki
Copy link

+1

@ileonardt
Copy link

+1

@fahimul-zilani
Copy link

Any solution on this one yet?

@igor-pavlichenko
Copy link

My workaround was to provide my own pagination component

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests