Home/ Questions/Q 9114717
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T04:15:46+00:00

I have and accordion working on a normal html page, but when I try

  • 0

I have and accordion working on a normal html page, but when I try and add it to a Spring MVC page then I get the error: $(...).accordion is not a function.

Here is the header of my WEB-INF\views\index.jspfile:

<!DOCTYPE html>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
         <head>
  <title>Jeeni Software Ltd</title>
  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
  <link rel="stylesheet" href="<c:url value="css/style.css"/>" type="text/css"> 
  <link rel="stylesheet" href="<c:url value="css/menu/menu_style.css"/>" type="text/css"/>
  <script type="text/javascript" src="<c:url value="js/jquery-1.8.3.js"/>"></script>
  <script type="text/javascript" src="<c:url value="js/jquery-ui-1.9.2.js">"></script>       
  <script type="text/javascript" src="<c:url value="js/jquery.flip.js"/>"></script>

...
<!-- This is the 'accordion' div -->
<div id="accordion" style="height:800px;">
   <h3>Title...</h3>
   ...

Here is the ready function:

$(document).ready(function() {

  var object = $("#accordion");
  alert("object: "  + object.accordion);

  $("#accordion").accordion({ collapsible: true, active: 'false', autoHeight: false });
  $("#banner").fadeIn(1000);

  alert("Done");
});

with this alert("object: " + object.accordion); show object: undefined and it bombs out on the next line.

Here is my servlet-context.xml file

<mvc:resources mapping="/cv/**" location="/cv/" />
<mvc:resources mapping="/wow/**" location="/wow/" />
<mvc:resources mapping="/css/**" location="/css/" />
<mvc:resources mapping="/imgs/**" location="/imgs/" />
<mvc:resources mapping="/js/**" location="/js/" />
<mvc:resources mapping="/inc/**" location="/inc/" />
<mvc:resources mapping="/article-imgs/**" location="/article-imgs/" />

<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
  <property name="viewClass" value="org.springframework.web.servlet.view.JstlView"/>
  <property name="prefix" value="/WEB-INF/views/"/>
  <property name="suffix" value=".jsp"/>
</bean>

Firebug shows no problem loading any of the jquery files. I can re-create the proper behavior outside of Spring mvc, so the problem must be something to do with Spring/Java?!? But I can not find out what. The only error Firebug reports is the $(...).accordion is not a function, but everything is setup just like on the jquery ui accordion example.

BTW, I’ve trawled the internet for the last 3 hours and found similar problems that were fixed by typos. This isn’t a typo error. I can not find anything like this regarding jquery UI and Spring MVC.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Solved!

    The problem was that I was importing some content via:

    <jsp:include page="../includes/index_page_intro_txt.jsp" />

    and this JSP file was re-importing jquery. Took this out and everything was fine.

    Special thanks to @NimChimpsky for being a sounding board and keeping me going.

    There’s no way anyone could have solved this with the information above. So just let you all know how I solved it:

    I started by removing everything from the file other than the library imports, the ready statement and the accordion div block. Then it worked. So I slowly added everything back until it stopped working and then investigated that cause.

    Should have done that in the first place – duh!

    • 0