material-table/Lobby

Domino987

@Domino987

Can you tell me what exactly you want to achieve. I don't understand

Jagdish Singh Mehra

@jagdishlove:matrix.org

[m]

disabling checkbox according to column values

jawad35

@jawad35

Hi, I am new here, Actually, I am stuck with the text color of pagination of the material table do you have any idea how we can achieve that thanks?

Domino987

@Domino987

@jawad35 you can override the pagiantion theme prop to achieve that

Jagdish Singh Mehra

@jagdishlove:matrix.org

[m]

can we change

editable={{
onRowUpdate: onUpdate,
onRowDelete: onDelete,

    }}

Icon of these editable??
without making custom action icon?

Federico Depetris

@DepetrisFe

hello friends, im facing a problem in a project that im using material-table/core 4.3.27

everything seems to be going well but when i build the project before upload, the components that include material table breaks the layout

Federico Depetris

@DepetrisFe

working locally everything goes well

Domino987

@Domino987

Do you have an error message or something. Because it still works for me as far as I know

But I am using v5 currently

Mui v5

Federico Depetris

@DepetrisFe

no, there is no error message

im using Mui v4

4.12.0 exactly

Domino987

@Domino987

So there is no way to debug it? Whats your setup?

Federico Depetris

@DepetrisFe

i found this thread mbrn/material-table#625

anishdev89

@anishdev89

Hi @all
I am trying to implement an Auto-scroll (Vertical) feature on a table. with fixed header..
Is there a way I can get the height of the table body?

Domino987

@Domino987

You could use the component override to overide it and pass a ref to it to get it with ref.current.clientheiht

anishdev89

@anishdev89

if I use the tableRef.clientHeight it will give me the Maxheight which I defined to achive fixed Header..

Also is there a way to scroll inside the table even if I get the height.. like window.scrollTo({ behavior: "smooth", top: 500});

Domino987

@Domino987

No add a new ref to the tableBody with https://material-table-core.com/demos/override/toolbar just with the body

anishdev89

@anishdev89

@Domino987 If I add

components={{
          Body: (props) => <MTableBody ref={divRef} {...props} />,
        }}

And then try to get height by divRef.current.clientHeight...I am getting undefined

Domino987

@Domino987

Would you mind throwing that in a sandbox and I'll take a look later

Eban Emmanuel

@eebbann

hey guys how do i updated my api after using the action function in material table..since im fetching from api ..if i use crud functionality it wont have any effect cus when i refresh will come back to default, need to post updated data to server ..please help like a your teaching a 5yr old

2 replies

Alejandro Plaza

@A-Plaza

Hi everyone! I have an issue where doing a setSelectedRow (updating my component's state) inside the onRowClick refreshes the table and scrolls all the way to the top, hence user being unable to see the selected row and having to scroll back down. I have maxBodyHeight option set, so the table has scrolling on it. Has anyone experienced this before? if so, how did you guys go about it? Thanks! BTW awesome library.

Domino987

@Domino987

Would you mind putting that in a sandbox. I have not seen this but I would take a look

Alejandro Plaza

@A-Plaza

I was able to find the cause of the issue. Seems like for the specified scenario I mentioned, If we are overriding the Container component, it will cause that effect. I removed the override and its now working.

sarsntony

@sarsntony

Has anyone tried following the material-table installation guide recently?
I just followed it and am running into

material-table.js:872 Uncaught TypeError: Cannot read properties of undefined (reading 'direction')
    at MaterialTable.renderFooter (material-table.js:872:1)

I just copied the instruction from https://github.com/mbrn/material-table, including

<MaterialTable
          columns={[
            { title: "Adı", field: "name" },
            { title: "Soyadı", field: "surname" },
            { title: "Doğum Yılı", field: "birthYear", type: "numeric" },
            {
              title: "Doğum Yeri",
              field: "birthCity",
              lookup: { 34: "İstanbul", 63: "Şanlıurfa" },
            },
          ]}
          data={[
            {
              name: "Mehmet",
              surname: "Baran",
              birthYear: 1987,
              birthCity: 63,
            },
          ]}
          title="Demo Title"
        />

Domino987

@Domino987

I think the mbrn version needs material UI < 4.4.2 or something. Try material table core for full support of material UI and Mui v5

sarsntony

@sarsntony

that did it, thanks

Eban Emmanuel

@eebbann

how possible is it to fetch column from api as my table header changes with time

9 replies

Lodnec

@Lodnec1_twitter

Hi All, after my data is loaded, is it possible to display the first child row automatically, without click? fyi, existing use case we have.

Domino987

@Domino987

What do you mean with first child row. Detail panel? Grouping? Track the table ref and the table data object and see what gets triggered once you toggle it manually. If you provide the same out of the box, a table data object in your row object, it should be open from the beginning

Lodnec

@Lodnec1_twitter

yes, detail panel of the first row. Force rendering the first child row automatically

Domino987

@Domino987

ok did you check the tabledata obejct?

Lodnec

@Lodnec1_twitter

I'll try, thanks

Lodnec

@Lodnec1_twitter

tableRef .current always return null, novice at this, please advise how can I track the event. Thanks in advance

Lodnec

@Lodnec1_twitter

I think I got the event. What are the input? path = [0] ? how about render

Domino987

@Domino987

@Lodnec1_twitter https://codesandbox.io/s/material-table-starter-template-forked-xvqtpl does this help

Lodnec

@Lodnec1_twitter

it works, this is the magic=> tableData: { showDetailPanel: i === 0 ? () => undefined : undefined }

I still don't understand, wow, thanks,

Domino987

@Domino987

Let me explain. We add a table data object to each row to track the 37482914 things that can happen to a row, edit, panel, clicked etc. It is normally hidden to the user. The detail panel is tracked by adding the function for the detail panel to the showDetailpanel key of tables data. If the user provides a ta leData object they will get merged. With the index is 0 you only add the showDetaolPanel to the first row. And now the showDetailpanel is set for the first row, we assume it's clicked and we show the panel on init

Lodnec

@Lodnec1_twitter

thanks for the detail explanation, it helps

Eban Emmanuel

@eebbann

@Domino987 tried your material-formik table but doesnt save when trying to update https://codesandbox.io/s/ty094?file=/src/index.js

Domino987

@Domino987

@eebbann You have to save it in onRowUpdate, but how and where you want to save it, is your choice, we just give you the new data. It has to be passed back to the data prop of the table at one point though

1 reply

<I_AM_IDRIS/>

@agboolaidris

I have a challenge using Material-table with MUI5, I don't know if anyone has any idea on how to set it up

Domino987

@Domino987

use the community fork material table core with the next tag

Where communities thrive

People

Repo info

Activity