0

I need it to connect my code to the HTML and loop through each of the items.

There are more items to loop through. I can't see a problem in my loop, and I have created others which work perfectly on different websites. Basically I need to add up the data-price if the checkbox is checked and put the total in a total box. The total box, which is what totalPrice is, has connected fine.

function totalPrice() {
  let totalprice = 5;

  const items = form.querySelectorAll('section.book');
  const cbamount = items.length;

  for (let i = 0; i < cbamount; i++) {
    const checkboxes = document.querySelectorAll('input[data-price][type=checkbox]');
    const box = checkboxes[i];

    if (box.checked) {
      totalprice = totalprice + parseFloat(box.dataset.price);
      alert(totalprice);
    } //if
  } //for

  document.getElementsByName("total")[0].value = totalprice;
}

<form id="booking" method="get">
  <section id="book">
    <h2>Select Events</h2>

    <div class="item">
      <span class="eventTitle">A Chr</span>
      <span class="eventStartDate">202</span>
      <span class="eventEnd">20</span>
      <span class="catD">Fam</span>
      <span class="venueNa">PLAYy</span>
      <span class="eventPr">1</span>
      <span class="chosen"><input type="checkbox" name="event[]" value="6" data-price="18.50"></span>
    </div>

   <div class="item">
        <span class="eventTitle">Ash</span>
        <span class="eventStartDate">202</span>
        <span class="eventEnd">2020-12-31</span>
        <span class="catD">Exhib</span>
        <span class="venueNa">The Biy</span>
        <span class="eventPr">0.00</span>
        <span class="chosen"><input type="checkbox" name="event[]" value="17" data-price="0.00"></span>
    </div>


  </section>
cacowa1
  • 21
  • 1
  • 5
  • I gave you [perfectly working code](https://stackoverflow.com/a/59552540/295783) and you chose to ignore it? – mplungjan Jan 02 '20 at 09:55
  • 3
    Also PLEASE post more than one section or items. You cannot have duplicate IDs – mplungjan Jan 02 '20 at 09:56
  • Furthermore the code has some issue: no section with "booking" class, variable "form" is not defined.... – Plastic Jan 02 '20 at 09:57
  • mplungian - I tried your code and it didnt work, I did not choose to ignore it. I'll update now. with more info on the HTML. – cacowa1 Jan 02 '20 at 10:02
  • 1
    ccowan1 - If this is the same fundamental issue as the question @mplungjan answered (instead of a new issue in relation to the same code), and yet the answer (which you've accepted) didn't work for you, **don't** post a new question. Instead: 1. Look **very** closely at the answer vs. your code, because after all, he provided a runnable solution that does work. 2. If you still can't figure it out, post a comment on the answer saying that and perhaps he (or others) can help. Repeatedly posting questions about the same central issue isn't how you're supposed to use SO. – T.J. Crowder Jan 02 '20 at 10:05

0 Answers0