title: Form population from checkbox selection
body: <p>This is a somewhat simplified version of the problem to make it easier to explain and a shorter question.</p>
  
  <p>I have X checkboxes:</p>
  
  <pre><code>&lt;input type="checkbox" class="checker" value="1" /&gt;
  &lt;input type="checkbox" class="checker" value="2" /&gt;
  &lt;input type="checkbox" class="checker" value="3" /&gt;
  ...
  </code></pre>
  
  <p>I have 2 columns, cert and cost, of Y number of input fields (X > Y) then a total at the bottom:</p>
  
  <pre><code>&lt;input type="text" class="cert" /&gt;&lt;input type="text" class="cost"&gt;
  &lt;input type="text" class="cert" /&gt;&lt;input type="text" class="cost"&gt;
  &lt;input type="text" class="cert" /&gt;&lt;input type="text" class="cost"&gt;
  ...
  
  &lt;input type="text" id="total" /&gt;
  </code></pre>
  
  <p>The user can select any combination of checkboxes (up to limit Y). When a checkbox is selected, it's value is entered into the first empty cert input. Depending on the cert value, the corresponding cost is then put into the adjacent cost input (e.g. cert 1 = cost 50, cert 2 = cost 100, etc).</p>
  
  <p>If a checkbox is unticked, the corresponding cert is cleared, as is the cost. </p>
  
  <p>The total at the bottom keeps a running total on a change to any thing.</p>
  
  <p>A few additional notes: </p>
  
  <ul>
  <li>The checkboxes are spaced throughout the form, not in one continual sequence.</li>
  <li>Similarly the cert and cost inputs are not actually side by side in the html (although do appear to be on the screen), there is other code between them.</li>
  </ul>
  
  <p>Any help / input is greatly appreciated as I'm mostly just producing a mess!</p>