How to get the value of the checkbox lable in material-ui?

Question

I am using Checkbox from material UI. This is the import statement:

import Checkbox from '@mui/material/Checkbox';

I have the following code being rendered :

<Checkbox value="Tutor 1" onClick={() => handleSendSelection()}/>

I want to get the value of the selected checkbox inside the handleSendSelection() function. When I print the value, it gives me undefined, whereas my expected value is the string "Tutor 1". How should I get the value of the checkbox?

const handleSendSelection = (event) => {
   console.log("value - ", event.target.value);
}

Answer 1

import { useState } from "react";
import "./styles.css";


export default function App() {

  const [value, setValue] = useState("")

  return (
    <div className="App">
      <input type="checkbox" value={value} onChange={() => (setValue("tutor_1"))} />
    </div>
  );
}

You can do something like that try to make an controlled checkbox qand set it according to your choice