JSFiddle - React, Tailwind, and code Playground

by John Grivas

HTML

<div class="Checkbox" style="width: 40px; height: 35px; margin-top: 3px;">
    <input type="checkbox" name="boxselector" id="ROICheckBox" onclick="toggleCheckboxes(this);" value="ROI" />
    <label for="ROICheckBox" style="height: 10px; padding-bottom: 18px;"></label>
</div>
<form>
    <input id='my_match' type='hidden' name='my_match[]' />
    <button>Submit</button>
</form>

JavaScript

$('form').submit(function () {
    var arr = [];
    var chkel =$('input[name="boxselector"]');
    var valueToAdd = "Pixel";
if($(chkel).is(':checked'))
{
if($(chkel).val() =="ROI")
    arr.push($(chkel).val());
    arr.push(valueToAdd);
}
console.log(arr);
   
    // Prevent actual submit for demo purposes:
    return false;
});