Communicating Within Tiles in JSP - tiles

I have a header,menu and a body to load the jsps. When i click a menu element everytime, the entire tile reloads. But i want to show the users the selected menu item. Since the tiles reloads, i am not able to get the element which was clicked by the user.Please let me resolve this. Thanks
<definition name="main-tiles" template="/WEB-INF/jsp/menu/home.jsp">
<put-attribute name="header" value="/WEB-INF/jsp/menu/header.jsp" />
<put-attribute name="menu" value="/WEB-INF/jsp/menu/menu.jsp" />
<put-attribute name="body" value="" />
</definition>
<definition name="home" extends="main-tiles">
<put-attribute name="body" value="" />
</definition>
<!-- User Tiles -->
<definition name="newUser" extends="main-tiles">
<put-attribute name="body" value="/WEB-INF/jsp/userandorg/user/newUser.jsp" />
</definition>

Tiles don't really 'communicate' with each other.
When a tiles-composed page is fully rendered in your browser, view the html (view source) and you should be hard-pressed to see any tile framework showing through. This means that when your user clicks on a menu, it is a round-trip communication back to your server which runs through your servlet code and then uses the tiles framework to compose the resulting html.
What you describe as the desired behavior is more like frameset or iframe behavior where different sections of your browser pane are literally different requests/responses. You can achieve the same effect with AJAX frameworks which can be a call to your servlet and then dynamically update specific blocks of your html (usually defined as div or span elements) without refreshing the entire page.
But, if you want to merely highlight the clicked menu using your tiles composition, have your servlet identify which menu was clicked and then use some JSTL on your menu.jsp page to identify the menu item link and provide some CSS styling to the menu link. It is still a round-trip (non-AJAX) communication, but it should give you the effect you describe.

Related

Spring MVC and Twitter Bootstrap template

Good Evening,
I am creating a project based on Spring MVC for the back end and Twitter Bootstrap for the front end.
I would like to create a template for recurring my pages (header and footer fixed for all pages) only that I would like to avoid repeating the code in all the pages (as it is not good practice and can lead to mistakes). Is there a way to centralize what? I thought about the jsp (one for the header and the footer) and recall within the various view. Is there a way to do so? Or there better alternatives?
thanks
You can use the JSP... There's include tag, you can use like this:
<%# include file="/views/templates/header.jsp" %>
// Rest of the content
<%# include file="/views/templates/footer.jsp" %>
Or you can use a framework for templates, like Tiles or Freemarker.
Spring MVC with Tiles: http://java.dzone.com/articles/spring-mvc-tiles-3-integration
Using tiles, the template page:
<body>
<div class="container" style="border: #C1C1C1 solid 1px; border-radius:10px;">
<!-- Header -->
<tiles:insertAttribute name="header" />
<!-- Body Page -->
<div class="span-19 last">
<tiles:insertAttribute name="body" />
</div>
<!-- Footer Page -->
<tiles:insertAttribute name="footer" />
</div>
</body>
And you can change dynamically the "body" tiles attribute.

Accessing Tiles attribute as a variable from Thymeleaf template?

I'm using Spring + Thymeleaf + Tiles combination.
I have a Tiles definition with a string attribute:
<definition name="myDef">
<put-attribute name="myAttr" value="foo"/>
</definition>
In a Thymeleaf template I want to use myAttr in expressions:
<div th:if="${myAttr == 'foo'}">...</div>
How whould I do it?
All I found so far is how to renger Tiles attributes directly to the output (<span tiles:string="myAttr" />), but wasn't able to figure out how to insert its content into a context variable.
Thank you.
I ended up doing a workaround - render Tiles attribute to a <span>, replace Thymeleaf conditions with JavaScript conditions (I'm using Angular), read that <span> value into a JS variable and let the client to do the rest.

how to avoid repetition in tiles definition in a Spring MVC project?

I'm starting with Spring MVC using JSP and Apache Tiles. I've learned that I can define views in a tile definition file like:
<definition name="index" extends="base.definition">
<put-attribute name="body" value="/WEB-INF/jsp/bodies/index.jsp" />
</definition>
However going forward like this, I'll need to repeat this simple pattern for every body template, replacing the two appearances of "index". Isn't there a way to avoid this repetition?
Tiles supports wildcards too. From the documentation here:
http://tiles.apache.org/framework/tutorial/advanced/wildcard.html
<definition name="bank/*" template="/layout.jsp">
<put-attribute name="body" value="/{1}.jsp"/>
</definition>
The {1} now refers to whatever the * matched in the view that was called. However, you may find it simpler to just keep the repetition.

Navigating from one page to Another page in spring webflow

can anyone give a simple example for spring webflow to navigate from one page to another page using a button
you need to be more a little more specific. but if you just want to navigate from one page to another, in terms of Webflow you can do this in the same flow:
these 2 pages will be 2 view-state and by clicking on a button you want to trigger an event that will transition you to from one to the other.
<view-state id="viewState1" view="viewPage1.html">
<transition on="nextPage" to="viewState2"/>
</view-state>
<view-state id="viewState2" view="viewPage2.html">
<transition on="previousPage" to="viewState1"/>
</view-state>
in your web page, you just need a submit button like this:
page 1:
<input type="submit" name="_eventId_nextPage" value="Next Page"/>
page 2:
<input type="submit" name="_eventId_previousPage" value="Previous Page"/>
I strongly advice you to read the documentation and some tutorials as there are many ways to accomplish this

Lazy loading parts of seam pages?

I'm working on a seam application (2.1.1.GA under JBoss AS 4.2.2) where a particular has a number of (sometimes large) sections that do not need to be rendered untill the user interacts with that particular section, think along the lines of an article title where the user clicks on the title and it expands to show a box containing the text.
I can implement this without any problems with Seam and Richfaces but the contents of all the sections are downloaded to the browser when the user first loads the page. Is there anyway for these sections (which may or may not contain richfaces controls themselves) to be downloaded on demand using ajax?
Thanks.
Lots of ways.
Just set rendered="false" on the box and then reRender it's parent container when you click the title.
eg. Where you have a boolean called showContent in your backing Bean that is toggled by the toggleContent() method:
<a4j:commandLink
value="This is a title"
ajaxSingle="true"
reRender="contentDiv"
action="#{someBackingBean.toggleContent}"/>
<a4j:outputPanel id="contentDiv">
<a4j:outputPanel rendered="#{someBackingBean.showContent}">
This is some text that is not rendered when the page loads
</a4j:outputPanel>
</a4j:outputPanel>
EDIT: In response to comment. Another way to do it would be to use the a4j:jsFunction (very handy) and some javascript.
<h1 onclick="toggleContent(this);">This is a title</h1>
<a4j:outputPanel id="contentDiv">
<a4j:outputPanel rendered="#{someBackingBean.showContent}">
This is some text that is not rendered when the page loads
</a4j:outputPanel>
</a4j:outputPanel>
<script>
function toggleContent(element) {
//check if the contentDiv has any contents (maybe check if element has a child under contentDiv)
//if it doesn't then call a4j:jsFunction to load the contentDiv eg. loadContent();
//hide or show div depending on the current state of it
}
</script>
<a4j:jsFunction name="loadContent" action="#{someBackingBean.toggleContent}" reRender="contentDiv"/>
Something like this anyway.
What about if you using scrollable table. How to implement fetching data in chunks?
Ragards
Marko

Resources