CODEWITHSUNDEEP
javascriptjqueryjquery-uijquery-ui-accordion
chuckfinley
chuckfinley

Reputation: 2595

jQuery UI: TypeError: $(...).accordion is not a function

For some reason the jQuery UI Accordion does not work. I keep getting this error:

TypeError: $(...).accordion is not a function

What am i doing wrong? Based on other answers on this site on similar topics, i think it has something to do with the included files.

My header includes are:

<!-- Mobile Specific Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">  

<!-- CSS -->
<link rel="stylesheet" href="<?php echo base_url(); ?>css/base_con.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>css/skeleton.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>css/layout.css">

<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script>
<![endif]-->

<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<!-- Favicons -->
<link rel="shortcut icon" href="<?php echo base_url(); ?>images/favicon.ico">
<link rel="apple-touch-icon" href="<?php echo base_url(); ?>images/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link rel="stylesheet" href="<?php echo base_url(); ?>css/custom-theme/jquery-ui-1.10.0.custom.css" type="text/css" />

<!-- Scripts -->
<script src="<?php echo base_url(); ?>js/jquery-1.9.0.js"></script>
<script src="<?php echo base_url(); ?>js/jquery-ui-1.10.0.custom.js"></script>
<script src="<?php echo base_url(); ?>js/responsiveslides.min.js" type="text/javascript">

Upvotes: 20

Views: 59110

Answers (5)

Tom
Tom

Reputation: 1

I had the same problem on a WordPress website. I added it in the header. Use <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

Upvotes: 0

Chad Crowe
Chad Crowe

Reputation: 1338

The order of the js files matters! 

/external/jquery/jquery.js should be listed above jquery-ui.js!

Upvotes: 0

Vivek Espa&#241;a
Vivek Espa&#241;a

Reputation: 101

Using two jquery.js files may cause a conflict and result in an errorbeing thrown. Avoid importing two or more jquery.js files.

Upvotes: 9

martynas
martynas

Reputation: 12290

This problem could arise from a couple of different things:

  • You are not including jQuery UI library.
  • You are including jQuery UI library above the inclusion of jQuery library
  • The path to jQuery UI and jQuery libraries might be incorrect
  • You are using a custom jQuery UI library that does not have an accordion

Since the first two do not apply to you, I would recommend triple-checking the path and using a full jQuery UI library instead of the custom one:

<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>

Upvotes: 38

AKS
AKS

Reputation: 1279

in your last code lines, include the script in below order :-

There is no need to include the below as it will be taken care by above scripts.

Upvotes: 1

Related Questions