Seems like JSPs, Velocity, Freemarker etc. can offer so-called "inner templating": I can describe an outer template, then define inner parts. Like this (simplified):
main.jsp:
<html>
<body>
<div class="container">
<%# include file="menu.jsp"%>
<%# include file="content.jsp"%>
</div>
</body>
</html>
So I can define menu.jsp and content.jsp and all works just fine. But here outer block has references to inners. Not very suitable for me.
I'm looking for technology for Java, that can let me implement something like this:
some_block.jsp:
<template file="main_template.jsp">
<div>
... my content here
</div>
</template>
main_template.jsp:
<html>
<body>
<div class="container">
<inner_content />
</div>
</body>
</html>
I. e. vice versa - inner blocks have references to outer. Is it possible with JSPs? If not - what should I use with Spring MVC?
EDIT: Why it be more comfortable for me: when Controller receives a request, it detects what view it should render. So I can render, for example, feedback form:
feedback.jsp:
<template file="main_template.jsp">
<form> ... feedback form content here ... </form>
</template>
or a product page product.jsp:
<template file="main_template.jsp">
<div> ... product page content here ... </div>
</template>
and there is no need to describe page structure for every kind of pages, and there is no need to pass any parameters to outer template to render content correctly. And even no need in dynamic compilation - all pages are just an implicit set of precompiled servlets.
I created a JSP taglib you might be interested in:
http://www.inamik.com/projects/webframes/
Here is how I would implement your request using the WebFrames taglib
Notice that this is an exact 1-to-1 correlation to your example, but unlike your example, WebFrames allows you to create unlimited place-holders so you could have things like dynamic titles, css-includes, right-channel content, left-navs, etc.
feedback.jsp
<%# page language="java" %>
<%# taglib prefix="wf" uri="/WEB-INF/tld/webframes.tld" %>
<wf:render file="main_template.jsp">
<wf:section name="inner_content">
<form> ... feedback form content here ... </form>
</wf:section>
</wf:render>
product.jsp
<%# page language="java" %>
<%# taglib prefix="wf" uri="/WEB-INF/tld/webframes.tld" %>
<wf:render file="main_template.jsp">
<wf:section name="inner_content">
<div> ... product page content here ... </div>
</wf:section>
</wf:render>
main_template.jsp
<%# page language="java" %>
<%# taglib prefix="wf" uri="/WEB-INF/tld/webframes.tld" %>
<html>
<body>
<div class="container">
<wf:render section="inner_content" />
</div>
</body>
</html>
Official WebFrames Example
Below is the full example set from the website showing how you can create/populate multiple place-holders:
http://www.inamik.com/projects/webframes/examples/simpleexample.jsp
Start by looking at the source for the example main page:
main http://www.inamik.com/projects/webframes/examples/simpleexample.jsp.txt
<%# page language="java" %>
<%# taglib prefix="wf" uri="/WEB-INF/tld/webframes.tld" %>
<wf:render file="frame.jsp">
<wf:section name="title">WebFrames Simple Example Page</wf:section>
<wf:section name="header" file="headersection.html" />
<wf:section name="footer" file="footersection.html" />
<wf:section name="body">
This page is a composite of the following sub-pages. Click the links below to see
the jsp/html that makes up each sub-page.
<UL>
<LI>simpleexample.jsp</LI>
<LI>frame.jsp</LI>
<LI>headersection.html</LI>
<LI>footersection.html</LI>
</UL>
</wf:section>
</wf:render>
See how this defines the content sections without defining the layout.
If you look at the layout ('frame.jsp') You'll see it doesn't know what content is going to be displayed, it just creates place-holders for the content:
frame http://www.inamik.com/projects/webframes/examples/frame.jsp.txt
<%# page language="java" %>
<%# taglib prefix="wf" uri="/WEB-INF/tld/webframes.tld" %>
<HTML>
<HEAD><TITLE><wf:render section="title" /></TITLE></HEAD>
<BODY>
<TABLE width="100%">
<!-- Header -->
<TR>
<TD>
<TABLE width="100%">
<TR>
<TD>
<wf:render section="header" />
</TD>
</TR>
</TABLE>
</TD>
</TR>
<!-- Body -->
<TR>
<TD>
<TABLE width="100%">
<TR>
<TD>
<wf:render section="body" />
</TD>
</TR>
</TABLE>
</TD>
</TR>
<!-- Footer -->
<TR>
<TD>
<TABLE width="100%">
<TR>
<TD>
<wf:render section="footer" />
</TD>
</TR>
</TABLE>
</TD>
</TR>
</BODY>
</HTML>
header http://www.inamik.com/projects/webframes/examples/headersection.html.txt
<!-- BEGIN headersection.html -->
<TABLE bgcolor="#00C0C0" width="100%">
<TR>
<TD nowrap="nowrap" align="LEFT">
<H1>WebFrames Sample Header</H1>
</TD>
</TR>
</TABLE>
<!-- END headersection.html -->
footer http://www.inamik.com/projects/webframes/examples/footersection.html.txt
<!-- BEGIN footersection.html -->
<TABLE bgcolor="#00C0C0" width="100%">
<TR>
<TD nowrap="nowrap" align="CENTER">
Copyleft (c) SampleFooter Inc.
</TD>
</TR>
</TABLE>
<!-- END footersection.html -->
This pattern provides a much more flexible solution that creates components that are re-usable and easier to maintain.
NOTES
This was based on earlier work by David Geary:
http://www.javaworld.com/javaworld/jw-12-2001/jw-1228-jsptemplate.html
Also, if you're willing (or considering) non-JSP solutions, I wrote a Java-based template engine in the spirit of PHP's Smarty template engine
https://github.com/iNamik/iNamik-Template-Engine
I also have a 'Frames' taglib for this engine, which isn't on GitHub yet.
I've found two solutions - complex one and very simple and cute:
First one is SiteMesh:
http://wiki.sitemesh.org/
And second is a custom tag from Claudius Hauptmann:
http://code.google.com/p/jsp-decorator
Both work fine, so I hope this can help to someone else.
This is straight forward to do using JSP TAG files.
First create your template tag:
/WEB-INF/tags/template/maintemplate.tag
<%# tag body-content="scriptless" %>
<html>
<body>
<div class="container">
<jsp:doBody/>
</div>
</body>
</html>
And then create your JSP page that uses the template tag:
/some_page.jsp
<%# page %>
<%# taglib prefix="template" tagdir="/WEB-INF/tags/template" %>
<template:maintemplate>
<div>
... my content here
</div>
</template:maintemplate>
Your JSP page uses the maintemplate.tag and passes it a block of body content. The maintemplate.tag chooses where to render that body content.
Related
I have one question about spring tag form and radiobuttons. I have a task something like testing. User logged in and can choose some test. On the test page i'm using spring tag form and radiobuttons for answering questions. For one question 4 answers. But on the test page when i'm trying to select one answer for question one is selected for all question. I mean i can select only one radio button. I know that in html for create group of radio buttons they should have same names. How i can create a group of radio buttons with spring tag form?
Here test_page.jsp
<%# page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" language="java" %>
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%# taglib uri="http://www.springframework.org/tags/form" prefix="form" %>
<html>
<head>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="/resources/js/timer.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" media="screen" href="/resources/styles/style.css"/>
<title>Test page</title>
</head>
<body onload="startTimer()">
<div id="info">
<h3>
Subject: <c:out value="${test.subject}"/>
</h3>
<h3>
Number of questions:
<c:out value="${test.questionNumber}"/>
</h3>
<h3>
Difficulty:
<c:out value="${test.difficulty}"/>
</h3>
<div id="clock">
<p>
<label for="timer">Time for test</label>
<span id="timer" style="color: #4af; font-size: 150%; font-weight: bold;">
<c:out value="${test.timer}"/></span>
</p>
</div>
</div>
<div id="test">
<form:form action="result" commandName="result" method="post">
<form:input type="hidden" path="testSubject" value="${test.subject}"/>
<form:input type="hidden" path="difficulty" value="${test.difficulty}"/>
<c:forEach items="${test.questionAnswersMap}" var="entry">
<h4><c:out value="${entry.key}"/></h4>
<div class="form-check">
<ul style="list-style: none">
<form:radiobuttons path="answers" items="${entry.value.existingAnswers}" element="li" class="form-check-input"/>
</ul>
</div>
</c:forEach>
<button id="finish" type="submit" class="btn btn-primary btn-block">Finish</button>
</form:form>
</div>
</body>
</html>
I'm using spring 4.
If someone knows how to solve that i will be grateful.
I am working on designing a web application using Java servlets and JSP and am having issues getting the JSP file to include the CSS file. Each JSP page that is called up includes references to header and footer JSP files and the header file includes the with link to the CSS. All of these files are in a secure resource folder "proforma" within my web application. Prior to trying to include the CSS, the security and the header/footer inclusions were working fine, and continue to do so - they are just not formatted per the CSS.
I have the CSS reference included in a header file as follows:
header.jsp
<%#page language="java" contentType="text/html" pageEncoding="UTF-8"%>
<%#taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="${pageContext.request.contextPath}/proforma/cssGuide.css" type="text/css"/>
<title>Pro Forma</title>
</head>
<body>
<h1>Pro Forma</h1>
When I use the pageContext Expression Langugae (${}) like the above, the page content that is loaded is the actual CSS content itself, not the actual content I am looking for.
However, if I use the following JSP code, I get the correct HTML content and the browser source review shows the loaded correctly, but there is no CSS source code:
Alternative header.jsp file (ProForma is the name of the application):
<%#page language="java" contentType="text/html" pageEncoding="UTF-8"%>
<%#taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="../ProForma/proforma/cssGuide.css" type="text/css"/>
<title>Pro Forma</title>
</head>
<body>
<h1>Pro Forma</h1>
Here is a sample content page that I am trying to format:
<%#include file="../proforma/header.jsp" %>
<table>
<tr>
<td>
${createProjectResponse}
</td>
</tr>
<tr>
<td>
<form action="/ProForma/downloadInput" method="post">
<input type="submit" name="downloadInputButton" value="Download Input File" class="controlCenterButton"/>
</form>
</td>
</tr>
<tr>
<td>
<form action="/ProForma/AddProject" method="post">
<input type="hidden" name="actionValue" value="addProject"/>
<input type="submit" name="addPortfolioSubmit" value="Add Project" class="controlCenterButton"/>
</form>
</td>
</tr>
<tr>
<td>
<form action="/ProForma/SelectProjectController" method="post">
<input type="hidden" name="actionValue" value="selectProject"/>
<input type="submit" name="selectProjectSubmit" value="Select Project" class="controlCenterButton"/>
</form>
</td>
</tr>
</table>
<%#include file="../proforma/footer.jsp" %>
Here is the CSS file (very simple at this point until I get it working):
input.controlCenterButton{
width: 20em;
height: 2em;
}
For what it is worth, here is the footer.jsp file:
<p id="footer_p">Company</p>
</body>
</html>
Is there something that I am missing that is preventing the CSS file from being included? I appreciate any help.
This is a Spring MVC project.
So the following JSP
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<table>
<c:forEach items="${nameList}" var="studentList">
<tr>
<td><c:out value="${studentList.name}"/> ${studentList.regNo}</td>
</tr>
</c:forEach>
</table>
returns values like
Ramu
Somu
Mamu
Komu
I want to make each value as a post url, so that, if the user clicks any one link, I would like to submit as like the following jsp code does
<form method="post" action="number" id="number">
<div style="text-align: center;" >
<input width="20" type="text" data-validation="numbers" id="regNo" name="regNo" size="30" maxLength="50" placeholder="Enter Register Number">
</div>
</form>
I don't wanna do GET.
How can I do this? Please help me.
Use this
<td><a href='www.xyz.com:port/number?regNo=${studentList.regNo}><c:out value="${studentList.name}"/> </a></td>
And regNo you can get as the request parameter in controller
or
Path parameter in your controller like
<td><a href='www.xyz.com:port/number/${studentList.regNo}><c:out value="${studentList.name}"/> </a></td>
And modify your controller's configuration accordingly.
In my spring project, I have two layers for my views:
1) each method from my controller map directly a jsp page like that:
<jsp:include page="../../common/listagem.jsp">
<jsp:param name="name" value="Usuario"/>
<jsp:param name="elements" value="{['login','senha','pnome','unome','email']}"/>
</jsp:include>
2) my jsp page common/listagem.jsp is this:
<%# include file="../include/header.jsp" %>
<sec:authorize access="hasPermission(#user, 'cadastra_${param.name}')">
<p>
<button type="button" class="btn btn-sm btn-link link" data-action="/${param.name}/cadastra">
Cadastrar novo ${param.name}
</button>
</p>
</sec:authorize>
<table class="bordered">
<thead>
<tr>
<c:forEach var="item" items="${param.elements}">
<th> <c:out value="${item}"/> </th>
</c:forEach>
</tr>
</thead>
<tbody class="content">
</tbody>
<tfoot>
<tr>
<sec:authorize access="hasPermission(#user, 'altera_${param.name}')">
<td class="comando" data-nome="Altera" data-action="/${param.name}/altera"></td>
</sec:authorize>
<sec:authorize access="hasPermission(#user, 'remove_${param.name}')">
<td class="comando" data-nome="Remove" data-action="/${param.name}/remove"></td>
</sec:authorize>
</tr>
</tfoot>
</table>
<c:url value="/${param.name}/listagem.json" var="listagem"/>
<script>
$(document).ready(function(){
load_content("${listagem}", $('table.bordered'));
});
</script>
<%# include file="../include/footer.jsp" %>
My problem it's exactly with the page above. the final result for this code is that:
but instead should display only the title of the columns in the top and the code:
<c:url value="/${param.name}/listagem.json" var="listagem"/>
<script>
$(document).ready(function(){
load_content("${listagem}", $('table.bordered'));
});
</script>
should fill the table with data from the server (this code works in other project mine, where I don't use include files and jsp:param).
Anyone can see what's wrong with this code?
You can try with JSP JSTL Functions but it more like a JSON string so try with Jackson JSON Parser.
Find tutorial on Jackson parser here.
Sample code:
<%# taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<c:set var="elements" value="${param.elements}" />
<c:forEach var="item"
items="${fn:split(fn:substring(elements,2,fn:length(elements)-2),',')}">
<c:out value="${item}" />
</c:forEach>
output:
'login' 'senha' 'pnome' 'unome' 'email'
OK, I solve this issue using an array for store the values, like that:
<jsp:param name="elements" value="login"/>
<jsp:param name="elements" value="pnome"/>
<jsp:param name="elements" value="unome"/>
<jsp:param name="elements" value="email"/>
and in the common jsp page:
<c:forEach var="item" items="${paramValues.elements}" varStatus="status">
<th class="col" data-property="<c:out value="${item}"/>">
<c:out value="${paramValues.label[status.index]}"/>
</th>
</c:forEach>
I'm starting to study struts and I have a problem using resource properties file
some text on page is displayed as this:
???login.message???
???login.username???
???login.password???
but some other messages are correctly taken from properties file. I think that the propertis file is correctly configured but I'm missing something to display anything correctly.
the file ApplicationResources.properties
# Resources for Login Project
# Struts Validator Error Messages
# These two resources are used by Struts HTML tag library
# to format messages. In this case we make sure that errors
# are red so that they can be noticed.
errors.header=<font color="red">*
errors.footer=</font>
#errors associated with the Login page
error.username.required=username required.
error.password.required=password required
error.login.invalid=The system could not verify your username or password. Is your CAPS LOCK on? Please try again.
#login page text
login.title=this is a title
login.message=please log in
login.username=username:
login.password=password:
login.button.signon=Log In
#loggedin page text
loggedin.title=Login Project
loggedin.msg=Benvenuto, {0}. You are now logged in.
"error.login.invalid" is correctly displayed and "error.username.required" too
the login label not
this is my jsp page
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%# taglib uri="http://java.sun.com/jstl/fmt" prefix="fmt" %>
<%# taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<html:html locale="true"/>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<fmt:bundle basename="ApplicationResources"/>
<title><fmt:message key="login.title"/></title>
</head>
<body>
<html:errors property="login"/>
<html:form action="login.do" focus="userName" >
<table align="center">
<tr align="center">
<td><H1><fmt:message key="login.message"/></H1></td>
</tr>
<tr align="center">
<td>
<table align="center">
<tr>
<td align="right">
<fmt:message key="login.username"/>
</td>
<td align="left">
<html:text property="userName"
size="15"
maxlength="15" />
<html:errors property="userName" />
</td>
</tr>
<tr>
<td align="right">
<fmt:message key="login.password"/>
</td>
<td align="left">
<html:password property="password"
size="15"
maxlength="15"
redisplay="false"/>
<html:errors property="password" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<html:submit>
<fmt:message key="login.button.signon"/>
</html:submit>
</td>
</tr>
</table>
</td>
</tr>
</table>
</html:form>
</body>
</html>
Can you help me ?
tkz
Your
<fmt:message ... />
tags need to be inside an
<fmt:bundle ... >
tag. Currently you are closing your bundle tag right away
<fmt:bundle basename="ApplicationResources"/>
Instead, open it
<fmt:bundle basename="ApplicationResources">
and close it
</fmt:bundle>
when you no longer need it, possibly at the end of your JSP. Nest your
<fmt:message key="login.title"/>
tags inside it.