0

I have a basic admin top-level plugin I wrote which has a submenu driving a php form with a grid table populated from wp_dbase (from a custom table 'Branches' in it).

My installation is a clean WP 3.3.1 on WAMPServer. Only changes are including the before the wp_head function in the , in the header file for both 2010 and 2011 themes.

My attempt at using JQuery 'Document.ready' does nothing. So I assume I have a Jquery setup problem. Any pointers / help would be much appreciated. (I have tried using JQueryUI dialog - modal - form as well, but zilch, nada,... Also the 'pop-up div' shows in the page, and does not 'popup'.

My form and Jquery function beneath.

<div class="wrap" id="main">
<form name="Sandwich Baron Branch Maintenance" method="post" action="<?php echo str_replace( '%7E', '~', $_SERVER['REQUEST_URI']); ?>">

$(document).ready(function(){
   alert("We're in Jquery world");

   $('#form-wrap').dialog({ 
       autoOpen: false, //FALSE if you open the dialog with, for example, a button    click            
        title: 'My Form',
        modal: true      
  });
}); 

and here the #form-wrap div it references

<div id="form-wrap " title="Branch Editing">
<p class="validateTips">All form fields are required.</p>
<form>
   <fieldset>
    <label for="BrName">Branch Name</label>
    <input type="text" name="txtBrname" id="txtBrName" class="text ui-widget-content ui-corner-all" />
    <label for="Tel">Tel</label>
    <input type="text" name="txtTel" id="txtTel" value="" class="text ui-widget-content ui-corner-all" />
   </fieldset>
</form>
</div>
1
  • You script isn't inside script tags for starters, and you need a no-conflict wrapper for that jQuery.. (you can find info on both those things with a quick google)..
    – t31os
    Jan 20, 2012 at 10:03

2 Answers 2

3

It is important, that you include your script with wp_enqueue_script() and defined the scripts, there are use your script. WP control the scripts. Your example has the problem, that your div and js inlcude this load before load jquiry and ui. Also it is possible, that WP load al scripts in Footer and then have you also the same problem. Hint: http://wpengineer.com/2028/small-tips-using-wordpress-and-jquery/

0

here is the code

function my_admin_init() {
        wp_enqueue_script('jquery');
        wp_enqueue_script('jquery-ui-core');//enables UI
        //wp_enqueue_script('jquery-ui-datepicker', $pluginfolder . '/jquery.ui.datepicker.min.js', array('jquery', 'jquery-ui-core') );
        wp_enqueue_style('jquery.ui.theme', '/wp-content/themes/<themename>/js/jquery-ui-1.8.9.custom.css');
    }
    add_action('admin_init', 'my_admin_init');

but make sure to include the css file and all the associated images (like any jQuery UI instalation).

Cheers.Bo

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.