title: Create quote summary of calculated fields
body: <p>I have a form that allows users calculate cost of services. I can use the form to output the total price of the selected services via checkbox and input values * the data-price. However, I would also like to create a summary of the services they selected. </p>
  
  <p>I sample of the results I am trying to achieve from my provided fiddle:</p>
  
  <p>This assumes Text 1 has an input of 3 and the first two checkboxes are checked</p>
  
  <pre><code>Quote
  Text 1        $29.85
  Checkbox 1    $19.90
  Checkbox 1    $45.95
  Total         $95.70
  </code></pre>
  
  <p>I want to use a data attribute (like how I use data-price) inside the input and checkbox fields due to the actual complex of my input labels.  </p>
  
  <p><a href="https://jsfiddle.net/evvaw9ta/" rel="noreferrer">https://jsfiddle.net/evvaw9ta/</a></p>