3

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

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');
2
  • How are you including jQuery in your admin page? If you edit your question to include the relevant code, that'd help potential answerers.
    – MathSmath
    Jan 24 '11 at 16:58
  • Done. You can see the code in the original post.
    – user1635
    Jan 24 '11 at 17:28
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();
0

It worked when i used version 1.7.3 of the jQuery UI.

Version 1.8.9 seems to have compatibility issues with the jQuert used by Wordpress admin.

1
  • Do you happen to know if 1.8.10 fixes this? Mar 9 '11 at 16:19
0

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.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy