Change Or Update Checkbox Values Using User Inputs

I am currently working on a WordPress project where I have a webstore made up using WooCommerce, and as a practice project I've decided to make refund system for customers to use,

Solution 1:

First, you have to change the following :

      echo "<input type='checkbox' name='productinfo[]' value='" . " " . $item->get_name() . "  ,  " . $item->get_quantity() . " QTY" . " | " . $item->get_total() ."'>";

to

      echo "<input type='checkbox' class='" . $item->get_id() . "checkBox' name='productinfo[]' value='" . " " . $item->get_name() . "  ,  " . $item->get_quantity() . " QTY" . " | " . $item->get_total() ."'>";

And this:

      if($item->get_quantity() > 1) {
        echo "Quantity: " . "<input type='number' name='numberqty' value='" . $item->get_quantity() . "'max='" .$item->get_quantity() . "' min='1' > " . "<br/>";
      }

To this:

      if($item->get_quantity() > 1) {
        echo "Quantity: " . "<input type='number' class='" . $item->get_id() . "' name='numberqty' value='" . $item->get_quantity() . "'max='" .$item->get_quantity() . "' min='1' onchange='changeCheckBoxValue(this.className)'> " . "<br/>";
      }

If you don't have a get_id() on item use any unique identifier.

This following piece of the code is responsible for triggering the event that changes the value of the checkbox onchange='changeCheckBoxValue(this.className)

And finally add the following function to your code:

function changeCheckBoxValue(className) {

    var checkBox = document.getElementsByClassName(className + 'checkBox')[0];
    var currentValue = checkBox.value;
    var wantedAmount = document.getElementsByClassName(className)[0].value;
    checkBox.value = currentValue .replace(new RegExp('[0-9]* QTY'),wantedAmount + ' QTY');
}

This will update the value of the checkbox

Good luck