Questions tagged [mui-x]

This tag should be used for questions regarding the MUI X library: a collection of advanced React components including a data grid and date and time pickers. This project is maintained by MUI.

Related tags

  • for questions that are React-related.
  • for questions that are MUI X Data Grid related.
  • for questions that are MUI X Date Pickers related.
  • for questions that are Material UI related, another open-source UI library by MUI.
  • for questions that are Joy UI related, another open-source UI library by MUI.
  • for questions that are Base UI related, another open-source UI library by MUI.
136 questions
0
votes
0 answers

Mui date range picker always select first day of year

Im working on a react porject using mui components I have this dateRangerPicker from mui components
0
votes
0 answers

How to change the background color of weeks after the current week in Static Date Picker

Right now i have the current week with a different color and the rest of the weeks with the same color. with this code i can reproduce the above image:
0
votes
0 answers

How to make events on CalendarDate in MUI-X v6

Can someone teach me how to make events on my CalendarDateIm stuck on here, I dont know how to use it in v6 I want to make events on my CalendarDate, but I dont know how to use slots and slotsProps. Please help me, Thankyou
0
votes
0 answers

How to Handle Row Validation in MUI DataGrid Pro with Checkbox Selection?

I have a React application with MUI DataGrid Pro, where users can select rows using checkboxes. Additionally, I have a validation service that checks the validity of the data for all the rows. My goal is to implement a button that updates the…
0
votes
0 answers

Object column in DataGridPro

Is there a way to access a column object in DataGridPro and include it in the quick search? The object structure is as below: [{ Id: "xxx", obj: [{ objId: "1", somethingInside: "" }, { objId: "2", somethingInside: "" }] }] I've tried declaring…
Red John
  • 11
  • 1
0
votes
1 answer

MUI DataGrid manually change rows per page count

I'm using MUI DataGrid v6 and i want to manually change rows per page count every time I search the data without refresh. As an example if i search something and I set rows per page count as 5. If I search again without refresh I want to set my rows…
MJ DEV
  • 686
  • 1
  • 11
  • 31
0
votes
0 answers

MUI datagrid pagination is not synced with filter

when I try to filter anything on the column of datagrid, after filter is applied there is only one results found but still pagination is rendering with all pages to display in the table. one result is found after filter but pagination is there, we…
0
votes
0 answers

MUI x-data-grid | Uncaught TypeError: Cannot read properties of undefined (reading 'current')

I have recently implemented MUI x-data-grid into my app, initially it was working fine but my app later started getting crashed giving me this error: Now, I am not using apiRef or object or anything so I have no clue how to fix it, Here is my…
Omama Zainab
  • 741
  • 4
  • 14
  • 24
0
votes
0 answers

DatagridPro, Tree view I want to show data with three levels on row expansion in Material UI

I am using the Material UI, DataGridPro and I want to display my data like this can anyone have any idea or any example that how can I add UI like this with material UI DataGridPro? I have tried every possible solutions and also researches on it but…
Nirali
  • 11
  • 4
0
votes
0 answers

MUI DataGrid action action button group don't change

In my MUI DataGrid Pro I have two action buttons in every row they should change depending wether the row is in edit or view mode. I copied the demo code from MUI and I adapted it to add the row to my database. Everything works well and the row is…
Irene
  • 49
  • 8
0
votes
0 answers

How to use "minDateTime" API in @mui/x-date-pickers?

I have to disable past Date with Time in MUI MobileDateTimePicker component. I have a MUI Form component with a MUI Calendar component consists of @mui/x-date-pickers (MobileDateTimePicker). I have to disable past Date with Time. I already used…
0
votes
0 answers

How to update cell props programmatically in Mui-Datagrid

We are using Mui-Datagrid component where the users can upload and edit their data. Within customID column definition, there are the preProcessEditCellProps and renderEditCell properties. const columns = [ { field: "customID", headerName:…
0
votes
0 answers

Design decisions behind MUI X components (number of rows below datagrid)

MUI is said to be a module based on the results of UI/UX research. Are the design decisions for components written down accordingly? I couldn't find them. Specifically for now, I wondered why the "number of rows" below the MUI DataGrid is displayed…
0
votes
0 answers

Any DatePicker component immediately errors

I am using react and typescript. I did everything according to the instructions, and when I add any component to the project, I get errors. In an empty new project everything works fine. My code: import React, { useState } from "react"; import {…
0
votes
0 answers

How to highlight week from Monday to Sunday by selecting one date in React MUI DesktopDatePicker?

I want to highlight the week from Monday to Sunday when selecting a date in MUI (5.0.20) DesktopDatePicker. What should I add to the DesktopDatePicker to make it highlight the week of selected date? Here is my current DesktopDatePicker…
Dmitry
  • 809
  • 3
  • 16
  • 29