CODEWITHSUNDEEP
jqueryspringjspmaven
user3231725
user3231725

Reputation:

Javascript code is not working inside the spring jsp

I am a biginner in spring and i need to display something in spring using jquery.I have imported some necessary jquery plugins.But my problem is that the javascript code is not working inside the jsp.I have tested it by using an alert statement and some other thing,but none of them work.I don't know what to do.Below is my jsp code index.jsp:

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4 /loose.dtd">
 <%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title id="Description">In this demo the jqxTree is built from JSON data.</title>
<spring:url value="/resources/jqx.css" var="jqueryUrl" />
<link rel="stylesheet" href="${jqueryUrl}" type="text/css">
<spring:url value="/resources/jquery-1.js" var="jqueryaUrl" />
<script type="text/javascript" src="${jqueryaUrl}"></script>
<spring:url value="/resources/demos.js" var="jquerybUrl" />
<script type="text/javascript" src="${jquerybUrl}"></script>
<spring:url value="/resources/jqx_002.css" var="jquerycUrl" />
<link rel="stylesheet" href="${jquerycUrl}" media="screen">
<spring:url value="/resources/jqxcore.js" var="jquerydUrl" />
<script type="text/javascript" src="${jquerydUrl}"></script>
<spring:url value="/resources/jqxdata.js" var="jqueryeUrl" />
<script type="text/javascript" src="${jqueryeUrl}"></script>
<spring:url value="/resources/jqxbuttons.js" var="jqueryfUrl" />
<script type="text/javascript" src="${jqueryfUrl}"></script>
<spring:url value="/resources/jqxscrollbar.js" var="jquerygUrl" />
<script type="text/javascript" src="${jquerygUrl}"></script>
<spring:url value="/resources/jqxpanel.js" var="jqueryhUrl" />
<script type="text/javascript" src="${jqueryhUrl}"></script>
<spring:url value="/resources/jqxtree.js" var="jqueryiUrl" />
<script type="text/javascript" src="${jqueryiUrl}"></script>
<spring:url value="/resources/jqxdropdownlist.js" var="jqueryjUrl" />
<script type="text/javascript" src="${jqueryjUrl}"></script>
<spring:url value="/resources/jqxlistbox.js" var="jquerykUrl" />
<script type="text/javascript" src="${jquerykUrl}"></script>  <style>
.dark_overlay{display:none;position:absolute;top:0%;left:0%;width:100%;height:100%;
background-color:black;padding-bottom:500px;z-index:1001;
-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);}.bright_content{display:none;
position:absolute;top:25%;left:25%;width:50%;height:50%;padding:16px;
border:16px solid #00ccff;background-color:white;z-index:1002;overflow:auto;}</style>
</head>
<body>
<div id="header" style="height:20%"></div>
<div id="content" style="float:left">
    <script type="text/javascript">
        $(document).ready(function () {
            document.getElementById('bttn').style.display='block';
            alert("hai");
                        });
    </script>
    <div id="jqxWidget">
    </div>

    <div id="bttn" style="display:none;"><input type="button" name="add" id="add" value="Add" /><input type="button" name="edit" id="edit" value="Edit" />
    <input type="button" id="delete" name="delete" value="Delete" />
    </div>
    <div style="display: none;" id="lightbox-shadow"></div>
    <div style="top: 4096px; display: none;line-height: 1.5;" id="lightbox"></div>
    <div style="display: none;" id="light" class="bright_content"><a href="javascript:void(0)" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a><div id="txtbx"><input type="text" id="itemNamess"></div>

    <div id="jqxDrp" style="display: none;"></div>
    <div id="ligtbx"></div></div>
    <div style="display: none;" id="fade" class="dark_overlay"></div>

</div>
<div id="footer" style="height:20%"></div>

</body>
</html>

And my servlet-context.xml file is:

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:mvc="http://www.springframework.org/schema/mvc"  
xmlns:beans="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"  
xmlns:tx="http://www.springframework.org/schema/tx"
xsi:schemaLocation="http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd
http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.2.xsd
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.2.xsd">

<!-- Enable @Controller annotation support -->
<mvc:annotation-driven />

<!-- Map simple view name such as "test" into /WEB-INF/views/test.jsp -->
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/WEB-INF/" />
<property name="suffix" value=".jsp" />
</bean>

 <!-- Scan classpath for annotations (eg: @Service, @Repository etc) -->
 <context:component-scan base-package="com.gerrytan.pizzashop"/>

 <!-- JDBC Data Source. It is assumed you have MySQL running on localhost port 3306 with 
   username root and blank password. Change below if it's not the case -->
 <bean id="myDataSource" class="org.apache.commons.dbcp.BasicDataSource" 
 destroy-method="close">
<property name="driverClassName" value="com.mysql.jdbc.Driver"/>
<property name="url" value="jdbc:mysql://localhost:3306/test"/>
<property name="username" value="root"/>
<property name="password" value="kca@fnpl#12"/>
<property name="validationQuery" value="SELECT 1"/>
</bean>

<!-- Hibernate Session Factory -->
<bean id="mySessionFactory"
class="org.springframework.orm.hibernate4.LocalSessionFactoryBean">
<property name="dataSource" ref="myDataSource"/>
<property name="packagesToScan">
  <array>
    <value>com.gerrytan.pizzashop</value>
  </array>
</property>
<property name="hibernateProperties">
  <value>
    hibernate.dialect=org.hibernate.dialect.MySQLDialect
  </value>
 </property>
</bean>

<!-- Hibernate Transaction Manager -->
<bean id="transactionManager"
class="org.springframework.orm.hibernate4.HibernateTransactionManager">
<property name="sessionFactory" ref="mySessionFactory"/>
</bean>

<!-- Activates annotation based transaction management -->
<tx:annotation-driven transaction-manager="transactionManager"/>
<mvc:resources mapping="/resources/**" location="/resources/" />
</beans>

I think this may be a simple mapping issue.But don't know actually where the problem is.Please help me.

Upvotes: 0

Views: 1492

Answers (1)

Deepu--Java
Deepu--Java

Reputation: 3820

Try 

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
<link href="<c:url value="/resources/main.css" />" rel="stylesheet">
<script src="<c:url value="/resources/jquery.1.10.2.min.js" />"></script>
<script src="<c:url value="/resources/main.js" />"></script>
</head>
<body>
    <h1>1. Test CSS</h1>

    <h2>2. Test JS</h2>
    <div id="msg"></div>

</body>
</html>

And your js and css file should be in resources folder.

Upvotes: 1

Related Questions