how to post check box value and checked status

Question

i am getting checkbox values , checked status, checkbox label, checkbox courseid. from the server using of axios method.....now i want to send back checked of checkbox value and

Answer 1

Use the form submit event to target the checkbox name, which yields a list of HTMLElement nodes. Convert them to an array and map into a list of key-value pairs using the input id and checked properties. Object.fromEntries converts this array into an Object.

The question now is, what format does your data need to be in for the POST request?

checkBoxSubmit = e => {
  e.preventDefault();
  const checkedValues = Array.from(e.target.intermediatecourse).map(el => [
    el.id,
    el.checked
  ]);

  // now have object of id-checked key-value pairs
  // filter/format accordingly for POST request endpoint needs
  // JSON.stringify and place in body of request

  Axios.post('http://127.0.0.1:8000/checkboxapi/user/')
    .then(response => {
    })
    .catch(error => {
      console.log(error)
    })
};

EDIT

I see you've also attached the checkBoxSubmit callback to the button's onClick handler versus the form's onSubmit handler. This means the handler is receiving a click event from the button instead of a submit event from the form.

Save

Should move handler to form