jahrentorp
jahrentorp

Reputation: 155

Div next to title in react-data-table-component

I am experimenting with React and the react-data-table-component. I have set up a test table like this:

<DataTable
    title={'TestTitle'}
    columns={[{ name: 'test 1', selector: 'test1' }, { name: 'test 2', selector: 'test2' }, { name: 'test 3', selector: 'test3' }, { name: 'test 4', selector: 'test4' }, { name: 'test 5', selector: 'test5' }]}
    striped
    responsive
    pagination paginationRowsPerPageOptions={[5, 10, 25, 50, 100]} />

I noticed that there is a div generated to the right of the to the title div in the table. It only has some weird classes assigned to it.Is it possible enter data in this div with some property to the DataTable?

enter image description here

I have experimented with the subHeader properties but it puts the new text under he title, making the table slightly higher which is not desirable.

<DataTable
    title={'TestTitle'}
    subHeader subHeaderComponent={'TestSubHeader'}
    columns={[{ name: 'test 1', selector: 'test1' }, { name: 'test 2', selector: 'test2' }, { name: 'test 3', selector: 'test3' }, { name: 'test 4', selector: 'test4' }, { name: 'test 5', selector: 'test5' }]}
    striped
    responsive
    pagination paginationRowsPerPageOptions={[5, 10, 25, 50, 100]} />

enter image description here

Upvotes: 0

Views: 2544

Answers (1)

jahrentorp
jahrentorp

Reputation: 155

Ok, so apparently I am a little bit too impatient for my own good. About one minute after I posted this question I realised that the actions property does exactly the thing I wanted. I guess that I probably should delete this question now. Or is this information usable for others?

Upvotes: 1

Related Questions