0

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

now how can i insert Jquery or Javascipt into this form to calculate those two fields together?

1 Answer 1

1

Replace your code to next:

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

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.

11
  • I added the code and made the changes i think but its not working :/ ..... does this code load on page load or after submission because i need it to work when the page loads? Feb 11, 2013 at 16:41
  • does it calculate on key press on any textfield except total after adding code?
    – Nikit
    Feb 11, 2013 at 21:18
  • nope nothing happens after adding it. i type into my textfields but get no output anywhere..i have my custom js in a seperate file and all. what could i be doing wrong? Feb 11, 2013 at 22:09
  • Did you create custom.js in yourmodulepath/js folder? If it's there, check in browser source, is custom.js appear there in head part...
    – Nikit
    Feb 11, 2013 at 22:26
  • not appearing in the header i jus get the beginning script type='text/javascript' but no other idicators. also the input id stays the same on the ltotal field instead of inheriting the "totalsum" id Feb 12, 2013 at 0:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.