javascriptphpjquerywordpressenqueue

jQuery function not registering in Wordpress


I am trying to add a script on my Wordpress site. Using jQuery I want add an "onChange" event to a numeric input (which belongs to the Calculated Fields Form plugin).

When I type something in the input field, nothing happens. It should have printed onChange in console.

So the problem is that the jQuery functions are not registering.

HTML:

<input id="fieldname2_1" name="fieldname2_1" min="1" type="number">

functions.php file:

function numeric_input_script() {
    wp_enqueue_script(
        'numeric-input', // naming my script so that i can attach other scripts and de-register, etc.
        get_stylesheet_directory_uri() . '/numeric-input.js', // this is the location of the script file
        array('jquery'), // this array lists the scripts upon which my script depends
        null, // version number
        true // states that the script needs to be loaded in the footer
    );
}
add_action( 'wp_enqueue_scripts', 'numeric_input_script' );

JS file:

jQuery(document).ready(function($) {
    console.log('Loading'); //shows up

    $('#fieldname2_1').on('change', function() {
        console.log("onChange"); //code inside this function does not work
    })

    console.log('Loaded');  //shows up
});

Things that I have tried, but with no success:

Any help would be appreciated. Thanks!


Solution

  • The function is registered but the actual issue is caused by the Calculated Fields Form plugin.