Solved

Jquery UI tab methods not working

Posted on 2013-01-27
12
4,336 Views
Last Modified: 2013-02-18
ui.txtHi,

attached is my Script file to render the tabs using jquery UI.

I am receiving following error:

Line: 490
Error: no such method 'rotate' for tabs widget instance

same is the case with other tab methods such as "add", "remove". Am I missing any reference?

I followed the documentation correctly ..am not sure where am doing wrong.

please help
0
Comment
Question by:Techsavy
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
12 Comments
 
LVL 1

Expert Comment

by:sanjaybhansali
ID: 38825793
you should use following java script and css :

       <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
      <script src="../../jquery-1.8.3.js"></script>
      <script src="../../ui/jquery.ui.core.js"></script>
      <script src="../../ui/jquery.ui.widget.js"></script>
      <script src="../../ui/jquery.ui.tabs.js"></script>

then try its work
0
 
LVL 11

Expert Comment

by:mcnute
ID: 38826074
Sorry your code was perfectly fine. It is just that the rotate feature has been removed from jqeury tabs ui library.

Here is a forked project which has it still implemented:
http://blog.chomperstomp.com/jquery-ui-tabs-rotate/reference-implementation.html
0
 

Author Comment

by:Techsavy
ID: 38829604
Hi mcnute,

As I mentioned it is not just with rotate method. It is with any method like "Add", "Remove" etc. So there is something fundamentally is wrong in my set up.

Please help.
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 82

Expert Comment

by:leakim971
ID: 38842222
replace :
 <script src = "jquery-ui-1.10.0.custom/jquery-ui-1.10.0.custom/development-bundle/jquery-1.9.0.js"></script>
    <script src="jquery-ui-1.10.0.custom/jquery-ui-1.10.0.custom/development-bundle/ui/jquery-ui.custom.js"></script>
    <link rel="stylesheet" type="text/css" href="jquery-ui-1.10.0.custom/jquery-ui-1.10.0.custom/jquery-ui-1.10.0.custom.min.css" />

Open in new window

by :
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/overcast/jquery-ui.css" />
<script src = "//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
 

Open in new window


And confirm you've no error
0
 

Author Comment

by:Techsavy
ID: 38846745
Hi  leakim971


with your reference paths I am getting "$" is undefined error. It is unable to find the Jquery reference.

i corrected your references by adding "http:" but still no avail.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 38846872
please provide a link to your page
be sure you place the jquery javascript (not the css) on the top of the other plugin/file include
0
 

Author Comment

by:Techsavy
ID: 38851180
Hi,

I have already given you my HTML page. Try to open it in browser and you can see the error I am getting.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 38851196
but you did not provide me your HTML page AFTER the updates from ID: 38842222
0
 

Accepted Solution

by:
Techsavy earned 0 total points
ID: 38886998
I figured myself...the script references should be at the botton
0
 
LVL 82

Expert Comment

by:leakim971
ID: 38887006
the script references should be at the botton
Could you give more info?
0
 

Author Closing Comment

by:Techsavy
ID: 38900979
I figured myself
0

Featured Post

Revamp Your Training Process

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Find out what you should include to make the best professional email signature for your organization.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

726 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question