How can i input values to a table column in database from a checkbox without submit button

[albimeta463]

<h3 align="center">Gusest list to the event!</h3><br />
   <?php
   if(mysqli_num_rows($result) > 0)
   {
   ?>
   <div class="table-responsive">
    <table id="myTable" class="table table-bordered">
     <tr>
      <th width="10%">Id</th>
      <th width="30%">Name</th>
      <th>Surname</th>
      <th>Check-in</th>
     </tr>
   <?php
    while($row = mysqli_fetch_array($result))
    {
   ?>
      <tr id="<?php echo $row["id"]; ?>" >
      <td><?php echo $row["id"]; ?></td>
      <td><?php echo $row["first_name"]; ?></td>
      <td><?php echo $row["last_name"]; ?></td>
      <td><input type="checkbox" name="chk1[]" class="checkbox" value=""></input> 
      </td>

     </tr>
   <?php
    }
   ?>
    </table>

this part of the code displays a table with id first name, last name and a colon with checkbox

and this is what my table in the database looks like

all I want to do is being able to insert “yes” or “no” values to the check_in colon when I checkbox into the PHP file. can anyone help me!

[Dormilich]

If you don’t want to use a regular form, you need to use AJAX.

Note, for boolean fields you should use a boolean data type (or in case of MySQL: TINYINT).

[WolfShade]

I concur with @Dormilich. You can set an onClick event on the checkboxes (suggest doing it by class name, not inline) that will use AJaX to submit the value of the checkbox (I’d suggest the ID) to an action page in the background that will alter the yes/no status in the database, and return a success/fail message to AJaX.

Allowing a user to “check out” might be problematic, as you’d have to check the “checked” status of the checkbox that is submitting the ID, and submit a yes/no along with the ID. Not too difficult.

V/r,

^ _ ^

[albimeta463]

guys is this better ? i changed the database check_in colon to boolean with 1 and 0, and if put a condition on top of the page to secelct only users that check_in=1, and at the function above i want to be able to update my table in database from 0 to1

[droopsnoot]

I’d think you’ll get a syntax error as you close the opening script tag too early.

I guess it’d probably work, you’d have to make sure that update.php does the update and then re-draws your original page. Ajax would make it slicker, by not requiring that page re-draw.

[Dormilich]

I see two further issues:

• it’s participation, not partecipation
• depending on what update.php does, doing it via a (cacheable) GET request might not be the best idea

[WolfShade]

In addition to what @Dormilich states:

1. I’d not use inline onClick. Use addEventListener in JS.

2. window.location.href will refresh the page. If you use AJaX in the background with an event.preventDefault(), it will appear seamless.

HTH,

^ _ ^

[m3g4p0p]

Hi @albimeta463, to expand a bit on @Dormilich’s replies, here’s how to use AJAX (using an XMLHttpRequest):

function change (delid) {
  var xhr = new HMLHttpRequest()
  xhr.open('PATCH', 'upload.php?del_id=' + delid)
  // Handle success
  xhr.addEventListener('load', console.log)
  // Handle error
  xhr.addEventListener('error', console.error)
  xhr.send()
}

Also as @WolfShade says, it would be better to use addEventListener() for the click handler as well:

<input type="checkbox" class="check-in" value="<?= $row['id'] ?>">

var checkboxes = document.querySelectorAll('.check-in')

function change (delid) {
  // ...
}

checkboxes.forEach(function (checkbox) {
  checkbox.addEventListener('click', function () {
    change(checkbox.value)
  })
})

[albimeta463]

thank you man it helped me a lot