mui-datatables Is there a way to add Customized Header Labels, like multiline headers?

Is there a way to add Customized Header Labels, like multiline headers?

Expected Behavior

I want to add two show two column data in one column, thus for rendering data, I can use render body and show multiple column values. but how do I add two labels in one column header?

Current Behavior

I tried doing this: const name= "

""

"Name"

""
""

"Id"

""

" { name: "dateTime", label: name},

but sorting fails by Maximum call stack size exceeded Note: i was not able to put "div", ignore the "" above.

Steps to Reproduce (for bugs)

Your Environment

Tech	Version
Material-UI
MUI-datatables
React
browser
etc

Apr 09 '20 11:04 arunkmr25

@gabrielliwerant I need similar multi header support too.Is there any such feature available?if not, then could u please help me with it? Need a feature in which we can provide nested objects in column like columns={[{ Header: 'Name', columns: [{ Header: 'First Name', accessor: 'firstName' }, { Header: 'Last Name', id: 'lastName', accessor: d => d.lastName }] }]}

such that we can have first name and last name under Name column as shown in the image

Apr 13 '20 06:04 kartiknegandhi

Hello @kartiknegandhi

In my opinion, implementing multi header now requires a complicated process.

First

customHeadRender	function		Function that returns a string or React component. Used as display for column header. function(columnMeta, handleToggleColumn) => string\| React Component

First you have to header render with customHeadRender

Second

customBodyRender	function		Function that returns a string or React component. Used as display data within all table cells of a given column. function(value, tableMeta, updateValue) => string\| React Component Example

Second you have to column render with **customBodyRender **

Apr 14 '20 12:04 wdh2100

Hi @wdh2100 even i am facing similar issue . i was not able to achieve using customHeadRender and customBodyRender

any small example would be helpful .

Thanks in Advance

Aug 31 '20 04:08 rohangampa

@rohangampa

ref : #1441

Aug 31 '20 04:08 wdh2100

Hello , i am facing the same problem any solution because i can't use neither exapnd nor customHeadRender

May 09 '21 10:05 arezki1990

@rohangampa

ref : #1441

Hi the issue you are referring to is for expanding the rows. The issue here is for multi line headers . Can someone provide an example for those of us who are still trying to figure it out? Or at least if you could tell us how to insert two table rows in the header?

Thank you