Answers.Body: <p>Here's how we do it:</p>
  
  <p>We do the two sets of items in a separate price field on the same price set. So the paid options that are required would be in one field, the complementary in another (or several others). I set the price field for the required options to required. Then they are forced to choose one of them. We only have one item in the required section and one in the optional section, but you could have more.</p>
  
  <p>This then forces them to choose the mandatory item every time. We had to do this because folks would select the optional item, the book, and not select the training registration as well. </p>
  
  <p><a href="https://i.sstatic.net/CE4u7.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/CE4u7.jpg" alt="Price fields in back-end"></a></p>
  
  <p><a href="https://i.sstatic.net/og25P.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/og25P.jpg" alt="Price fields on page"></a></p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2018-12-10T19:28:32.327Z
Answers.LastActivityDate: 2018-12-10T19:28:32.327Z
Answers.UserDisplayName: Jenni Simonis
Answers.Body: <p>I ended up using click rather than just setting checked. This enables more than one payable item to enable access to the 'free' items.</p>
  
  <pre><code>function ConferenceManager() {
  var mgr = this;
  mgr.bootcamp = jQuery('#price_4_4');
  mgr.pioneerAwards = jQuery('#price_4_6');
  mgr.mainConference = jQuery('#price_4_7');
  mgr.specialistRoundTables = jQuery('#price_4_8');
  
  // Main conference is checked by default, but bootcamp is not.
  mgr.mainConferenceChecked = true; // mgr.mainConference.defaultChecked is undefined
  mgr.bootcampChecked = false;
  mgr.changing = false;
  
  mgr.bootcamp.change(function () {
    if (mgr.changing) {
      mgr.changing = false;
    } else {
      if (document.getElementById('price_4_4').checked) {
        mgr.bootcampChecked = true;
      } else {
        mgr.bootcampChecked = false;
        if (!mgr.mainConferenceChecked) {
          mgr.pioneerAwards.prop('checked', false);
          mgr.specialistRoundTables.prop('checked', false);
        }
      }
    }
  });
  
  mgr.pioneerAwards.change(function () {
    if (this.checked) {
      // Main conference is checked
      if (!mgr.mainConferenceChecked &amp;&amp; !mgr.bootcampChecked) {
        mgr.changing = true;
        mgr.mainConferenceChecked = true;
        mgr.mainConference.click();
      }
    }
  });
  
  mgr.mainConference.change(function () {
    if (mgr.changing) {
      mgr.changing = false;
    } else {
      if (document.getElementById('price_4_7').checked) {
        mgr.mainConferenceChecked = true;
      } else {
        mgr.mainConferenceChecked = false;
        if (!mgr.bootcampChecked) {
          mgr.pioneerAwards.prop('checked', false);
          mgr.specialistRoundTables.prop('checked', false);
        }
      }
    }
  });
  
  mgr.specialistRoundTables.change(function () {
    if (this.checked) {
      // Main conference is checked
      if (!mgr.mainConferenceChecked &amp;&amp; !mgr.bootcampChecked) {
        mgr.changing = true;
        mgr.mainConferenceChecked = true;
        mgr.mainConference.click();
      }
    }
  });
  }
  
  var conferenceManager = new ConferenceManager();
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2018-12-10T22:43:53.127Z
Answers.LastActivityDate: 2018-12-10T22:43:53.127Z
Answers.UserDisplayName: Interlated
Body: <p>The requirement is that if someone picks a complimentary part of the event they have to select a paid part.</p>
  
  <p>I have updated with jquery the rule so that if someone checks a free option the corresponding paid for option is also checked. The price calculation update is not performed. How do I get the prices to update?</p>
  
Tags: <civievent><javascript>
Title: How do I trigger a price calculation update on the event registration page?
ThreadText: # How do I trigger a price calculation update on the event registration page?
  
  (Asked by: username_0 on 2018-12-10)
  
  The requirement is that if someone picks a complimentary part of the event they have to select a paid part.
  
  I have updated with jquery the rule so that if someone checks a free option the corresponding paid for option is also checked. The price calculation update is not performed. How do I get the prices to update?
  
  **Tags:** civievent, javascript
  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_1 on 2018-12-10. Score: 2 | Accepted answer
  
  Here's how we do it:
  
  We do the two sets of items in a separate price field on the same price set. So the paid options that are required would be in one field, the complementary in another (or several others). I set the price field for the required options to required. Then they are forced to choose one of them. We only have one item in the required section and one in the optional section, but you could have more.
  
  This then forces them to choose the mandatory item every time. We had to do this because folks would select the optional item, the book, and not select the training registration as well.
  
  [![Price fields in back-end](https://i.sstatic.net/CE4u7.jpg)](https://i.sstatic.net/CE4u7.jpg)
  
  [![Price fields on page](https://i.sstatic.net/og25P.jpg)](https://i.sstatic.net/og25P.jpg)
  
  
  ---
  
  ### Answer by username_0 on 2018-12-10. Score: 1
  
  I ended up using click rather than just setting checked. This enables more than one payable item to enable access to the 'free' items.
  function ConferenceManager() {
  var mgr = this;
  mgr.bootcamp = jQuery('#price_4_4');
  mgr.pioneerAwards = jQuery('#price_4_6');
  mgr.mainConference = jQuery('#price_4_7');
  mgr.specialistRoundTables = jQuery('#price_4_8');
  
  // Main conference is checked by default, but bootcamp is not.
  mgr.mainConferenceChecked = true; // mgr.mainConference.defaultChecked is undefined
  mgr.bootcampChecked = false;
  mgr.changing = false;
  
  mgr.bootcamp.change(function () {
    if (mgr.changing) {
      mgr.changing = false;
    } else {
      if (document.getElementById('price_4_4').checked) {
        mgr.bootcampChecked = true;
      } else {
        mgr.bootcampChecked = false;
        if (!mgr.mainConferenceChecked) {
          mgr.pioneerAwards.prop('checked', false);
          mgr.specialistRoundTables.prop('checked', false);
        }
      }
    }
  });
  
  mgr.pioneerAwards.change(function () {
    if (this.checked) {
      // Main conference is checked
      if (!mgr.mainConferenceChecked && !mgr.bootcampChecked) {
        mgr.changing = true;
        mgr.mainConferenceChecked = true;
        mgr.mainConference.click();
      }
    }
  });
  
  mgr.mainConference.change(function () {
    if (mgr.changing) {
      mgr.changing = false;
    } else {
      if (document.getElementById('price_4_7').checked) {
        mgr.mainConferenceChecked = true;
      } else {
        mgr.mainConferenceChecked = false;
        if (!mgr.bootcampChecked) {
          mgr.pioneerAwards.prop('checked', false);
          mgr.specialistRoundTables.prop('checked', false);
        }
      }
    }
  });
  
  mgr.specialistRoundTables.change(function () {
    if (this.checked) {
      // Main conference is checked
      if (!mgr.mainConferenceChecked && !mgr.bootcampChecked) {
        mgr.changing = true;
        mgr.mainConferenceChecked = true;
        mgr.mainConference.click();
      }
    }
  });
  }
  
  var conferenceManager = new ConferenceManager();
  
  
  ---
  
  