jQuery UI in Admin (Best Practice?)

3 Views

Maybe someone has prior experience with this, but when I include the jQuery UI 1.8.9 file within my admin_head I break the functionality of the dashboard (i.e. popup for adding featured image, drag and drop menu items, etc.). If I include 1.7.2, it doesn’t break anymore but then my great little calendar won’t work anymore.

So my questions is, currently (3.0.x),what is the best way to implement the jquery UI within admin pages without breaking everything?

Read More

(Other info: trying to add datepicker to a field within my custom post type)

Thank you!

Noel

Post Views: 3

Related posts

Leave a Reply

3 comments

  1. WP 3.1 will come with jQuery UI 1.8 so the easiest solution would be to wait.

    Also, it sounds like you’re outputting the script tag directly. You should try deregistering the bundled jQuery UI version and replacing it with your own.

    This is done using wp_deregister_script() and wp_enqueue_script().

  2. Thanks again scribu, here the working result for anyone interested (custom-admin is just my js for the datepicker):

    function wpse_9080_admin_head()
{
    global $pagenow;

    // Example of enqueue only in Profile page
    // based on scribu's suggestion in the comment bellow
    if ( 'profile.php' == $pagenow )
    {
            wp_enqueue_style('ui-datepicker', get_bloginfo('template_url') . '/css/jquery-ui-1.8.9.custom.css');
            wp_deregister_script('jquery-ui-core');
            wp_enqueue_script('jquery-ui', get_bloginfo('template_url') . '/js/jquery-ui-1.8.9.custom.min.js', array('jquery'));
            wp_enqueue_script('ui-datepicker', get_bloginfo('template_url') . '/js/jquery.ui.datepicker.min.js');
            wp_enqueue_script('custom_script', get_bloginfo('template_url').'/js/custom-admin.js', array('jquery'));
    }
}

add_action('admin_init', 'wpse_9080_admin_head');

  3. What would be right way to load jQuery UI only on custom post type page?

    global $pagenow
if ($pagenow == 'post-new.php?post_type=events') {
// enqueue scripts here
}

    is this correct way?