Custom script doesn’t work in admin

  • Resolved epd

    (@epd)


    6 years, 11 months ago

    Hello,
    i have added a custom script file in admin , for change background color in variation “Stock status” select

    This is the code for enqueue the file in my child-theme

    function epd_custom_admin_script($hook) {
if( 'post.php' != $hook ) return;
wp_register_script( 'custom-admin-script', get_stylesheet_directory_uri() . '/js/custom-admin-script.js', array('jquery'), '1.0', true);
wp_enqueue_script( 'custom-admin-script' );
}
add_action( 'admin_enqueue_scripts', 'epd_custom_admin_script' );

    This is the script code

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

    var select = $('.hide_if_variation_manage_stock select');

    select.on('change', function () {

        var ss = $(this).val();

        if (ss === 'instock') {
            select.css('background', 'green');
        } else if (ss === 'outofstock') {
            select.css('background', 'red');

        } else if (ss === 'onbackorder') {
            select.css('background', 'yellow');
        }
    });
});

    the code does not work, but if I try the console, the code works fine as you can see here screenshot

    someone can help me understand why?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Caleb Burks

    (@icaleb)

    Automattic Happiness Engineer

    Are you sure if( 'post.php' != $hook ) is the hook being passed? Remove that for testing.

    Look in the dev console, and see if your script is loaded on the page. If you see it, open it up in a new browser window to make sure path was correct and all.

    Also, variations might not be loaded when you code first runs. May need to refresh or hook into an event when variations are loaded / refreshed / paginated.

    Thread Starter epd

    (@epd)

    yes it is passed correctly,
    please check here screenshot

    I added another code for change color background toolbar as you can see it works correctly …. below in the variants the script does not work!

    Thread Starter epd

    (@epd)

    Hello,
    I have done new tests and I have found that the scripts do not work only in the variation tab.
    I have set the same script in tab inventory and work fine as you can see in this
    video

    is there a particular reason why the script does not work on the variations tab?

    Caleb Burks

    (@icaleb)

    Automattic Happiness Engineer

    Right, so that’s the second thing I mentioned above.

    Your script runs when the page is first loaded (or when the script is first loaded rather). Variations are loaded later, after your script has already turned things colors. JavaScript isn’t like CSS. Speaking of, might want to try CSS: https://stackoverflow.com/questions/8619406/css-selected-pseudo-class-similar-to-checked-but-for-select-elements

    For the JavaScript approach, you need to watch for changes in the variations area and re-apply your changes, or search for what action WC uses to switch out variations and run after that.

    Thread Starter epd

    (@epd)

    sorry I did not understand was referred to this!
    thanks for your clarifications.

    adding this code, now my script is executed correctly

    $('#woocommerce-product-data').on('woocommerce_variations_loaded', function(event) {
    //...
});
Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Custom script doesn’t work in admin’ is closed to new replies.