4

I'm using this jQuery script / function to change the design of my select box: http://tutorialzine.com/2010/11/better-select-jquery-css3/

It's implemented and working. My site is built up by an index file that includes all other parts of the page via php include: parts like about, contact, etc.

The problem though is that in the separate contact page (not including a header, only body content) where my styled select boxes are displayed, the "styling" if you will only works when jquery is included once again directly in the contact.php file (already included in index.php).

  <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.js"></script>

Once removed from contact.php, all select option items are set to null. This wouldn't be much of a problem if only datePicker in another part of the site didn't stop working as what I believe to be a consequence of including jQuery twice.

I've tried all sorts of solutions like checking if it's really there:

 if (typeof jQuery == 'undefined') {  
 document.write('<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.js"></script>');
 }

jQuery is not undefined, it's there all right, you can even see it when browsing through the source code. Any ideas on why this is happening?

Jonathan
  • 2,953
  • 3
  • 26
  • 37
  • Where in the document are you including jquery when you have it in your index? – Mike Park Apr 23 '12 at 01:59
  • 1
    There may be other reasons why jQuery isn't working. Sometimes PHP and jQuery conflict as they both use '$'. Try declaring your document.ready() like this: `jQuery(document).ready(function($){ // your code })` – ahren Apr 23 '12 at 02:01
  • **Climbage:** in the head section just like it should be. **Ahren:** thanks but didn't work.. Any other ideas? – Jonathan Apr 23 '12 at 02:07
  • Could you put an example of how it looks the header's HTML with jquery included twice? Have you checked the javascript console to look for errors? – Skatox Apr 23 '12 at 02:28
  • can't see how that would help, its just the same code posted above printed twice, once in the head section and once in the body section (from contact.php) When Included once: **No error** in console. When included twice: "TypeError: 'undefined' is not a function (evaluating '$( "#datepicker" ).datepicker()')" which is what happens when jQuery's included more than once (http://stackoverflow.com/questions/1212696/jquery-ui-datepicker-datepicker-is-not-a-function) @ahren any further ideas? – Jonathan Apr 23 '12 at 03:41
  • @Jonathan You could try shifting it from a header include to being a footer include? – ahren Apr 24 '12 at 08:02

3 Answers3

2

I solved my issue a few days after i posted this. The problem was that jQuery was included three times altogether (because of php include). This caused my initial problem. When I removed what I believed to be the second and unneccesary jquery, there was still one too many. So please consider this while dealing with similar errors, you might have included it far more times than you realize and one solution would be to really make sure only one jquery include is running. Good luck

Jonathan
  • 2,953
  • 3
  • 26
  • 37
0

use jquery from google not your own server some times our jquery library dosen't work properly... 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
Huzoor Bux
  • 1,026
  • 4
  • 20
  • 46
0

Are you running your code inside

$(function() {
    // Your jQuery code here
});

jQuery needs to be initiated, which happends on page load. Perhaps you're trying to do some functions that are executed before jQuery is ready?

EDIT:
Noticed this suggestion to be mentioned in comments.

You're not using <iframe> for contact.php, are you?

Robin Castlin
  • 10,956
  • 1
  • 28
  • 44