Calculate the sum of two form fields with javascript? Hello there i was wondering if anyone had the solution to a problem i am having with my  Custom Module. I created a custom form a few days ago and i need two or more(4) field values to be added together and the sum to be output in another field(total).Please not i am using form_panels here s snippet of how the fields are built.

$form['Contract']['twelfth'] = array(
 '#type' =&gt; 'textfield',
 '#title' =&gt; t('Plus FEE of:'),
 '#size' =&gt; 40,
 '#field_prefix' =&gt; "$",
 '#form_panel_row' =&gt; 7,
 '#form_panel_col' =&gt; 1
);
$form['Contract']['thirteenth'] = array(
 '#type' =&gt; 'textfield',
 '#title' =&gt; t('For a OTHER PRICE of:'),
 '#size' =&gt; 30,
 '#field_prefix' =&gt; "$",
 '#form_panel_row' =&gt; 7,
 '#form_panel_col' =&gt; 3
);
$form['Contract']['fourteenth'] = array(
 '#type' =&gt; 'textfield',
 '#title' =&gt; t('For a TOTAL PRICE of:'),
 '#size' =&gt; 40,
 '#default_value' =&gt; "",
 '#field_prefix' =&gt; "$",
 '#form_panel_row' =&gt; 8,
 '#form_panel_col' =&gt; 1
 );


now how can i insert Jquery or Javascipt into this form to calculate those two fields together?
Replace your code to next:

&lt;?php
  $form['Contract']['twelfth'] = array(
   '#type' =&gt; 'textfield',
   '#title' =&gt; t('Plus FEE of:'),
   '#size' =&gt; 40,
   '#field_prefix' =&gt; "$",
   '#form_panel_row' =&gt; 7,
   '#form_panel_col' =&gt; 1,
   '#attributes' =&gt; array(
      'class' =&gt; array('summable'),
    ),
  );
  $form['Contract']['thirteenth'] = array(
   '#type' =&gt; 'textfield',
   '#title' =&gt; t('For a OTHER PRICE of:'),
   '#size' =&gt; 30,
   '#field_prefix' =&gt; "$",
   '#form_panel_row' =&gt; 7,
   '#form_panel_col' =&gt; 3
   '#attributes' =&gt; array(
      'class' =&gt; array('summable'),
    ),
  );
  $form['Contract']['fourteenth'] = array(
   '#type' =&gt; 'textfield',
   '#title' =&gt; t('For a TOTAL PRICE of:'),
   '#size' =&gt; 40,
   '#default_value' =&gt; "",
   '#field_prefix' =&gt; "$",
   '#form_panel_row' =&gt; 8,
   '#form_panel_col' =&gt; 1
   '#attributes' =&gt; array(
      'id' =&gt; 'totalsum',
    ),
    '#js' =&gt; array(drupal_get_path('module', 'YOURCUSTOMMODULE') . '/js/custom.js'),
   );
?&gt;


Don't forget rename YOURCUSTOMMODULE to your module name. 

Create custom.js in your module path/js folder:
custom.js:

(function ($) {

Drupal.behaviors.custom = {
  attach: function (context) {
    $('input.summable').keyup(function() {
      var sum = 0;
      $('input.summable').each(function() { sum += parseFloat(this.value); });
      $('#totalsum').val(sum);
    });
  }
};

})(jQuery);


p.s. Don't forget add summing code for inputs in submit function of your form in drupal module, since user can disable JS in browser.