title: Checking checkboxes on webform via URL query string
body: <p>I'm working on a registration form with several classes from which one can choose more than one (checkboxes). There is also a corresponding fee that is popped into a textbox for each class.
  One also must select one membership category (radio buttons).</p>
  
  <p>Each checkbox item has a unique ID and value. They are all named "courses[]".  When the form is submitted, the values are sent to the registration desk via a php script that writes to a database and sends email (and all the courses' titles are under "Courses").</p>
  
  <p>Here's the issue: 
  I want visitors of the website to be able to click on a link next to the class they want. The link is a URL query string that pre-fills the regform with the default membership category and also checks the checkbox next to the class. But so far it's only working for the radiobutton option of membership and not for the checkbox classes. I need to modify or replace the code to accommodate these checkboxes, but I need help. </p>
  
  <p>The URL query string I am using looks like this (not a real URL):</p>
  
  <p><a href="https://domain.edu/summer.php?membership=Current&amp;courses=ClassTitle_12345" rel="nofollow noreferrer">https://domain.edu/summer.php?membership=Current&amp;courses=ClassTitle_12345</a></p>
  
  <p>Here's the pertinent script from the form page [loads after DOM]:</p>
  
  <pre><code>function getUrlParameters() {
      var urlQuery = location.search;
      urlQuery = urlQuery.replace('?', '');
  
      if (urlQuery.indexOf('&amp;') == -1) {
          checkPreselectedMembership(urlQuery);
          checkPreselectedMembership(urlQuery);
     } else {
          var params = urlQuery.split('&amp;');
          for (var i = 0; i &lt; params.length; i++) {
              checkPreselectedMembership(params[i]);
          }
      }
      total();
  }
  
  function checkPreselectedMembership(param) {
      var split = param.split('=');
       if (split[0] == "membership") {        
         if (split[0].match(/^[0-9a-zA-Z_]{1,20}$/)) { // only allow numbers, letters, and the underscore
              document.getElementById(split[1]).checked = true;
  
          }
      }
  }
  </code></pre>
  
  <p>And here a snippet of the HTML:</p>
  
  <pre><code>&lt;input name="courses[]" type="checkbox" id="class01"  onClick="classFees();total();"    value="ClassTitle1_12345" title="Check to select course"&gt;
  Class Title 1&lt;/td&gt;
  $&lt;input name="class01_fee" size="10" type="text" readonly title="class fee"&gt;
  
  &lt;input name="courses[]" type="checkbox" id="class02"  onClick="classFees();total();" value="ClassTitle2_34568" title="Check to select course"&gt;
  Class Title 2&lt;/td&gt;
  $&lt;input name="class02_fee" size="10" type="text" readonly title="class fee"&gt;
  </code></pre>
  
  <p>I hope that I have been clear with my questions. Thank you.</p>