I am trying to create a simple application that includes Sitemesh for decorating the resulting page.
Following is the simple page I am trying to create.
<%@ include file="/WEB-INF/jsp/include.jsp" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
<title>Creating a simple map</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAXWLpztTcGIDURBKce345XdXtfws5guEs"></script>
<script type="text/javascript" src="<c:url value=" /resources/js/keydragzoom_packed.js " />"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
function init() {
alert("hi");
}
</script>
<style>
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body onLoad="init();">
<h1>Smart Farm Application</h1>
<p>Time right now is :
<c:out value="${now}" />
</p>
<table border="1" style="width: 1000px; height: 800px;">
<tr>
<th>Google Map API</th>
<th>Google Chart Section</th>
</tr>
<tr>
<td rowspan="2">
<div id="google_map_area" style="width: 500px; height: 800px;"></div>
</td>
<td>
<div id="scatter_chart_area" style="width: 500px; height: 400px;"></div>
</td>
</tr>
</table>
</body>
</html>
And following is the decorator page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html; charset=UTF-8" %>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>https://bharatonjava.wordpress.com |
<decorator:title default="Sitemesh Example" />
</title>
<link rel="stylesheet" type="text/css" src="<c:url value=" /resources/assets/css/style.css " />">
<decorator:head />
</head>
<body>
<table class="mainTable" id="page-container" cellpadding="5" cellspacing="0" border="1" align="center">
<tr>
<td colspan="2" id="page-header">
<%@ include file="/WEB-INF/includes/header.jsp" %>
</td>
</tr>
<tr>
<td id="nav-container" colspan="2">
<%@ include file="/WEB-INF/includes/navigation.jsp" %>
</td>
</tr>
<tr>
<td id="left-nav-container">
<%@ include file="/WEB-INF/includes/navigationLeft.jsp" %>
</td>
<td id="content-container">
<decorator:body onLoad="<decorator:getProperty property='body.onLoad' />">
</decorator:body>
</td>
</tr>
<tr>
<td colspan="2" id="page-footer">
<%@ include file="/WEB-INF/includes/footer.jsp" %>
</td>
</tr>
</table>
<table align="center">
<tr>
<td align="center">
<br /><a href='https://test.com'>test</a>
</td>
</tr>
</table>
</body>
</html>
However this is not getting decorated at all. When I request the page from browser I see the following error :
java.lang.RuntimeException: org.apache.jasper.JasperException: /WEB-INF/decorators/layout.jsp(37,12) Attribute onLoad invalid for tag body according to TLD
com.opensymphony.sitemesh.webapp.decorator.BaseWebAppDecorator.render(BaseWebAppDecorator.java:39)
com.opensymphony.sitemesh.webapp.SiteMeshFilter.doFilter(SiteMeshFilter.java:84)
I can't figure out where I am wrong with the code above. I have spent hours trying to figure this without going anywhere. Has anyone faced this before ?
In fact it's
onload="init();"instead ofonLoad="init();", that's what raises the Exception, take a look at onload Event.Or you can try this:
Or
More information at element.addEventListener.