jquery UI in wordpress admin

Does anyone have experience with using the jQuery UI plugins in the WordPress admin area?

I´ve been trying to use the datepicker functionality in jQuery UI, but its conflicting with the built- in jQuery in wordpress admin. http://docs.jquery.com/UI/Datepicker

Read More

This is the error message I get in console:

Uncaught TypeError: Cannot read property 'apply' of undefined
a.widget.a.extend._trigger
b.Widget._createWidget
b.widget.b
b.widget.bridge.b.fn
c.extend.each
c.fn.c.each
b.widget.bridge.b.fn
postboxes.init
postboxes.add_postbox_toggles
(anonymous function)
c.extend.ready
L

What could I possibly do to avoid this conflict?

Adding the code used to include the jquery:

wp_register_script( 'jquery-tooltip', 'http://cdn.jquerytools.org/1.2.5/jquery.tools.min.js');
wp_register_script( 'jquery-ui-datepicker', get_bloginfo('template_directory') . '/js/jquery-ui-1.8.8.custom.min.js' );
wp_register_script( 'jquery-admin-internal', get_bloginfo('template_directory') . '/js/jquery.admin.internal.js' );
wp_register_script( 'jquery-internal', get_bloginfo('template_directory') . '/js/jquery.internal.js' );

function enqueue_admin_jquery() {
wp_enqueue_script('jquery-ui-datepicker');
wp_enqueue_script('jquery-admin-internal');
}
add_action('admin_init', 'enqueue_admin_jquery');

Related posts

Leave a Reply

3 comments

  1. This is what I include in my calendar plugin:

      // Alternative solution for loading scripts only in plugin page
      if( (is_admin() ) && (isset($_GET['page'])))   { 
          // Register scripts and styles
          add_action('admin_init', 'wp_eventcal_init');
      }  
    
      function wp_eventcal_init() {    
        // Only load these scripts in Admin
        wp_deregister_script('jquery-ui-core');
        wp_register_script('jquery-ui','http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.js',array('jquery'));
        wp_enqueue_script('ui-datepicker', plugins_url('js/jquery.ui.datepicker.min.js',__FILE__));
        wp_enqueue_script('ui-timepicker', plugins_url('js/jquery.timepicker.js',__FILE__));
        wp_enqueue_script('wp-calendar', plugins_url('js/wp-eventcal.js',__FILE__));
        wp_enqueue_style('event_cal_css', plugins_url('styles/eventcal.css',__FILE__));          
      }
    

    Then I just do this:

    jQuery("#event_startTime, #event_endTime").timePicker();
    
  2. I believe some installs of 3.1 are not loading all of the required supporting JQuery UI 1.8.9 scripts. In particular, “widgets.js”. Hence, the “widgets” error.