If statement for buying lightbulbs (update)

I need to write a PHP script that computes the total cost of the ordered light bulbs and battery packs after adding 17.5 percent VAT. The program must inform the buyer of exactly what was ordered in a table, and what credit card was chosen to make payment.

Here is my code so far (it is a form with checkboxes and radio buttons to order light bulbs

<?xml version = "1.0" encoding = "utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<script>
function formSubmit() {
    document.forms["myForm"].submit();
}
</script>
</head>
<body>

<form name="myForm" action="calc.php" method="post">
Name: <input type="text" name="fullname"><br>

  <input type="checkbox" name="bulb[]" value="Bulb1"> Four 100-watt light bulbs for $2.39<br>
  <input type="checkbox" name="bulb[]" value="Bulb2"> Eight 100-watt light bulbs for $4.29<br>
  <input type="checkbox" name="bulb[]" value="Bulb3"> Four 100-watt long-life light bulbs for $3.95<br>
  <input type="checkbox" name="bulb[]" value="Bulb4"> Eight 100-watt long-life light bulbs for $7.49<br>


Number of battery packs you would like for $10.42 each: <input type="text" name="batterypacks"><br>

  <input type="radio" name="card" value="Card1"> Visa<br>
  <input type="radio" name="card" value="Card2"> Mastercard<br>
  <input type="radio" name="card" value="Card3"> American Express<br>

  <input type="submit" value="Submit">
</form>


</body>
</html>

In my calc.php file, I have included this:

<?php

echo $_POST;

echo "<br>";

echo $_POST['bulb'];




if(isset($_POST['bulb'])){
  if (is_array($_POST['bulb'])) {
    foreach($_POST['bulb'] as $value){
        $bulb1=2.39;
        $bulb2=4.29;
        $bulb3=3.95;
        $bulb4=7.49;
        $totalCost;
      echo $value;
    }
  } else {
    $value = $_POST['bulb'];
    echo $value;
  }
}






?>

My last step is to create IF statements that would run through the checked boxes based on what the user selected, and calculate the total price of the bill. It would look something like this:

// if bulb 1 is selcted, add to total price //compare checkedItem==Bulb1

else checkedItem==Bulb2

else checkedItem==Bulb3

Is there a way to link checkboxes with parents in html without any javascript?

I know with checkboxes you can have an indeterminate state which has a dash or square dot in it. This is to tell the user it's children checkboxes have some but not 0 or all, selected. Is there a way to link children with parent checkboxes, so the state of the parent will automatically reflect the state of it's children, without javascript? Something like this:

<input type="checkbox" name="parent1"/> Parent 1
    <input type="checkbox" for="parent1"/> Child 1
    <input type="checkbox" for="parent1"/> Child 2
<input type="checkbox" name="parent2"/> Parent 2
    <input type="checkbox" for="parent2"/> Child 1
    <input type="checkbox" for="parent2"/> Child 2

Thanks

How to add checkbox to form submission with jquery?

I am developing a little website with webflow and must now write a tiny bit of custom code. To simplify and summ up, I have a checkbox that is outside fo the form tag. My goal is to write a little jquery of javascript code to "capture" the checkbox outside the form tag and add it to the form submission.

Here is what I came up with, but it's still not working. Would you have an idea ? I'm pretty new to code... thank you :)

The script:

<script>

// defines the variable for the form
var form = document.getElementById("reservation");

// add the checkbox with the id of "outsider" to the form submission
document.getElementById("outsider").addEventListener("click", function () {
  form.submit();
});

</script>

Vertical Alignment Of Checkboxes Using CSS

Working on converting some of the forms on our website to be housed within our new emailing platform (Pardot, a part of Salesforce). Using their CSS editor to create the forms, but I don't have much experience in CSS. I got all the labels for a checkbox to align vertically, but they're in a diagonal line instead of a vertical line. Any tips on how to fix that?

I also attached an image of what the form looks like on the website. Image is here.

Here's the CSS:

pardot-form input[type="checkbox"] {
  background-color: #fff;
  color: #666;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  line-height: 1.75em;
  height:18px;
  width:18px;
  padding:0;
  margin-top:5px;
  display:block;
  float:left;
}

Jquery selector for checkboxes not getting correct items

I have a page that contains x number of rows, dynamically generated from a database. Each form has a set of checkboxes and a save button. Everything else is working correctly, but it seems like no matter which save button I click, it's pulling in the selections from all the forms (after the first one; whichever save button I click first has the correct selections.) Where am I going wrong here?

<table>
    <tr class="even">
        <td class="checksCol">
            <input type="checkbox" name="pages_new" id="new_10" value="10">salads<br>
            <input type="checkbox" name="pages_new" id="new_9" value="9">sandwiches<br>
            <input type="checkbox" name="pages_new" id="new_7" value="7">sides<br>
            <input type="checkbox" name="pages_new" id="new_14" value="14">soups<br>
        </td>
    </tr>
    <tr class="odd">
        <td colspan="3">
            <input type="button" class="saveDisclaimer" id="saveDisclaimer_new" value="Save">
        </td>
    </tr>
</table>

<table>
    <tr class="even">
        <td class="checksCol">
            <input type="checkbox" name="pages_2" id="2_10" value="10">salads<br>
            <input type="checkbox" name="pages_2" id="2_9" value="9">sandwiches<br>
            <input type="checkbox" name="pages_2" id="2_7" value="7">sides<br>
            <input type="checkbox" name="pages_2" id="2_14" value="14">soups<br>
        </td>
    </tr>
    <tr class="odd">
        <td colspan="3">
            <input type="button" class="saveDisclaimer" id="saveDisclaimer_2" value="Save">
        </td>
    </tr>
</table>

$(document).ready(function() {
  $('.saveDisclaimer').click( function(e) {
    var id = this.id.split("_").pop();
    console.log("id: " + id);
    var pages = [];

    $('input[name="pages_"+id]:checked').each(function() {
      pages.push(this.value);
    });
    console.log("pages from input name=pages_" + id);
    console.log(pages);

    e.preventDefault();
  });

});

JSBin example - select a few checkboxes from the first form; click save. The console shows the correct selections. Then, without deselecting the checkboxes, click a few in the second form, and click the second save button. The console shows ALL checkboxes that are still selected, not just the ones that go with the particular save button.

How we can choose only 4 from a group of checkbox when the data is coming from the database

I want to show JavaScript alert when user trying to choose more than four values from the group of checkbox the checkbox names are in array

<div class="checkbox alert alert-primary">

    <p><input type="checkbox" id="calorieCheckbox" name="txt_tradesman[]" value="<?php echo $restrad['tradesman_id'] ?>" onClick="return KeepCount()"><?php echo $restrad['fullname'] ?> <p>    

</div>

vb.net listview check/uncheck checkbox on row click

I want to check or uncheck my checkbox in a listview when I click on the row. Now I have to click the checkbox but I want it to be checked or unchecked when I click on any part of the row.