Question

I have written a small module for Drupal 7 to check if someone is changing the status of a checkbox (field-type “boolean” with name “field_calculate”).
The rendered HTML-Markup in the edit-form is:

<input type="checkbox" class="form-checkbox" value="1" name="field_calculate[und]" id="edit-field-calculate-und">

To load the JavaScript/ jQuery in the form, i use this (working) code:

<?php function java_form_alter(&$form, $form_state, $form_id){
if($form_id == 'article_node_form'){
     $form['field_calculate']['#after_build'] = array('_load_my_javascript');
  }
}
function _load_my_javascript($element){
    drupal_add_js( drupal_get_path('module', 'java') . '/java.js');
    return($element);
} ?>

On each “article_node_form” the script “java.js” gets loaded. All fine.
The script is

(function ($) {
alert("START");
    $('input#edit-field-calculate-und').change(function() {
       alert("KLICK");
    });            
})(jQuery);

When loading the page /node/add/article the alert “START” appears (means: the script gets loaded correctly).
After that, the content of the page appears.

When clicking/changing the checkbox “Calculate” nothing happens.
I expected the second alert “KLICK” to appear.

What’s wrong? How to get the change-event fired for a checkbox in the node-form?

Thanks for your help!
Tobias

Answer 1

The following script works like expected:

jQuery(document).ready(function($) {

$('#edit-field-calculate-und').change(function() {
alert('Handler for .change() called.');
});

});