Support » Fixing WordPress » How To Activate a jquery ui dialog

  • Resolved dorich


    I have a dialog script in jquery that works correctly if I hard code the script links into the header of the template.

    However, I’m trying to implement the addition of the scripts through a child template.

    I can get the scripts and css to appear in the header but the script no longer works, the failure mode is that the page does not complete loading. Chrome shows a repeating message saying that its waiting for…

    I assume that the source of the problem is in the function.php file, shown below:

    function scripts () {
    	if ( !is_admin() ) {
    		wp_register_script('jqueryUI', "", array('jquery')); //register custom UI library
    		wp_register_script('popUpText', '', array('jquery', 'jqueryUI'));
    add_action('init', 'scripts');
    //INSERT CSS	files into the header
    function styles () {
    	if ( !is_admin() ) {
    		wp_register_style('jqueryUIcss', "");
    		wp_register_style('valuecss', "");
    	add_action('init', 'styles');

    I’d appreciate any pointers on what I’m doing wrong.


Viewing 4 replies - 1 through 4 (of 4 total)
  • Did you get it working in the end?

    Have you tried using the ui.dialog.js that ships with WordPress? You could probably drop your wp_register_script() and use wp_enqueue_scrtip(‘jquery-ui-dialog’); instead. That will cue up jquery and all the other dependencies also.

    I’ve got that part working, but for the life of me I can’t get the CSS to load properly with wp_enqueue_style(‘wp-jquery-ui-dialog’). It just doesn’t seem to work…

    Love & joy – Callum.

    My apologies but I don’t immediately recall the specifics of the solution. As best I can recall the problem was solved once I understood how to implement child templates correctly.
    I’ll go back through my notes during Friday to see if I can find information on what I did.

    Hola dorich,

    Do you speak the Doric by the way? 🙂

    No worries. I resolved my own issue. Turns out that the ui dialog css files are not included in 3.0.4, but they are in trunk. I was looking at trunk on my machine and 3.0.4 on the server, DOH! 🙂

    Love & joy – Callum.

    Here is how to use it since it is now included:




    var dlg = $("<div id='myFancyDialog' />")

    'dialogClass' : 'wp-dialog',
    'modal' : true,
    'autoOpen' : false,
    'closeOnEscape' : true,
    'buttons' : [
    'text' : 'Close',
    'class' : 'button-primary',
    'click' : function() {

    It’s one ugly monster, I hope WP peeps improve the look of it. X-closing thing looks like from outer-space, borders are outstandingly horrible too.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How To Activate a jquery ui dialog’ is closed to new replies.