0

I am using the following script to call my Jquery and Jquery UI as well as a custom-script.js. Currently it works to the point of being able to see the resource in the inspector and the tag's are outputted. However the code I use on the page like .datepicker just doesn't work. However If I use a hacked script tag and include my own jquery files my code works and .datepickers works. You can view the site at http://fiftyfity.com/place-an-order/ this is the version with the wp_enqueue_script running. I am stuck I want to use enqueue but it breaks my site.

wp_enqueue_script

function wptuts_scripts_basic() { // Register the script like this for a plugin: //wp_register_script( 'custom-script', plugins_url( '/js/custom-script.js', __FILE__ ) ); // or // Register the script like this for a theme: wp_register_script( 'custom-script', get_template_directory_uri() . '/js/custom-script.js', array('jquery','jquery-ui-core') ); // For either a plugin or a theme, you can then enqueue the script: wp_enqueue_script( 'custom-script' ); } add_action( 'wp_enqueue_scripts', 'wptuts_scripts_basic' ); 

Ouputted Html

<script type='text/javascript' src='http://fiftyfity.com/wp-includes/js/jquery/jquery.js?ver=1.7.1'></script> <script type='text/javascript' src='http://fiftyfity.com/wp-includes/js/jquery/ui/jquery.ui.core.min.js?ver=1.8.16'></script> 

My hacked script tag *this works If I comment out the wp_enqueue_script

$url = content_url(); <script src="<?php echo $url; ?>/themes/fiftyfityNew/js/jquery-1.7.1.min.js"></script> <script src="<?php echo $url; ?>/themes/fiftyfityNew/js/jquery-ui-1.8.17.custom.min.js"></script> 

1 Answer 1

1

The problem is that your first block of inline datepicker js is before jQuery and jQuery UI.

When you use wp_enqueue_script your script tags will be output where your wp_head() action hook is located. Move your inline datepicer js below wp_head and your jQuery should work.

enter image description here

You should also be using the no conflict wrapper for your inline datepicker js:

jQuery(document).ready(function($) { $("datepicker").datepicker({ }); 
2
  • still doesn't work after changing that. Don't know why. Commented Feb 22, 2012 at 4:48
  • Works for me in Safari. Commented Feb 22, 2012 at 4:51

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.