February 3, 2011

Part 11: Finalizing the Interface

If you have followed this tutorial so far, you will probably remember that in Part 2 I had shown you how the GUI will look when we're done. Here it is again:

We have put together everything except our interface, so it's time to modify our index.jsp to finalize the interface. Here's how your index.jsp file should look right now:

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
 <title>Modeling Agency Index</title>
</head>
<body>

<h1>The IdleWorx Modeling Agency</h1>
<hr>

<div style="width:300px;float:left;">
 
 <h2>Available Clients</h2>
 <c:forEach items="${all_clients}" var="client">
  <a href="client.do?id=${client.id}">${client.name}</a><br>
 </c:forEach> 
</div>

<div style="width:300px;float:left;">
 <h2>Available Models</h2>
 <c:forEach items="${all_models}" var="model">
  <a href="model.do?id=${model.id}">${model.name}</a><br>
 </c:forEach> 
</div>

<div style="clear:both;">
 <h2>Bookings</h2>
 <table border="1">
 <tr>
  <th>Client</th>
  <th>Model</th>
  <th>Time</th>
  <th>Place</th>
 </tr>
 <c:forEach items="${all_bookings}" var="booking">
 <tr>
  <td>${booking.client.name}</td>
  <td>${booking.model.name}</td>
  <td>${booking.time}</td>
  <td>${booking.location}</td>
  <td></td>
 </tr>
 </c:forEach> 
 </table>
</div>

</body>
</html>

Open up: http://localhost:8080/ModelingAgency/test.do. You should now have an interface very similar to the image above.

You'll notice I used the JSTL and EL libraries to nicely write our output (please don't use scriptlets in your JSP classes).

Also if you haven't noticed so far, in your ModelingAgency web application folder, you should have a file called sql.log wich has logged all of the SQL statements that MyBatis generated. You may find it useful when debugging your MyBatis apps

Congrats

If you got this far, I hope you now feel more comfortable about MyBatis,Tomcat and MySQL. You should now have all the basics to get a very simple app started in Eclipse using these technologies.

You can download a full version of the app here.

This tutorial took me a long time to write, so if you found it useful in any way, if you found errors with it or you think something is missing, please let me know and I will do my best to improve it.

Go back to the IdleWorx Monster MyBatis Tutorial

18 comments:

Taps said...

You are a star, greetings from Africa.

Anonymous said...

I was looking for some plumbing code to get started with ibatis and this worked at the first try.

Great article.

Anonymous said...

Great job man! You really showed the whole process. Very good for starters ;-)

Sapan Diwakar said...

Awesome man!
you did a great Job for us.
I really appreciate your efforts.

qatommy said...

Thank you for your hard work in putting this together. i used NetBeans 6.9 IDE instead of Eclipse, so my mappers and configuration files went in different locations ("Other Sources"), but this was an excellent learning experience for me. Thanks!

Jeff said...

I only needed the JDNI setup.. but I can see you poured your love into it and made a fantastic well-documented piece of work.

Great job and respect!

Anonymous said...

Great tutorial, right on the money exactly what I was looking for. Thanks!.

Just on question, which may sound rookie, but where is the web application folder location is (for the sql.log file)?
I am using the built in tomcat 7 from within eclipse.

Anonymous said...

found it, sorry for the obvious question. it's in the home directory of the modelegency folder as specified in the logBack.xml file.

Lake said...

Thanks for posting this, I is a great learning tool and I also got it running pretty easily with your directions. Thanks Lake.

Anonymous said...

Any thoughts around adding some examples that show lazy loading?

Ruggiero said...

Thanks from Italy!

This was exactly what i need!

It works also with eclipse indigo and tomcat 7.

jatin patel said...

It worked in Eclipse Helios for me.....

Thanks.
Jatin

daniel said...

this tutorial is the best for ibatis beginner

Michael said...

Bravo!

maithilish said...

Very nicely written and presented. Thanks a ton

Shankar said...

Nice post. Everything worked as advertised. nice intro to Ibatis. (one small comment is the class names in the junit test need to be capitalized for all three classes . Client instead of client etc. nothing major, but a newbie may find themselves stuck.
Good work, folks like you keep all open source technologies marching forward.

Shankar said...

Nice post. Everything worked as advertised. nice intro to Ibatis. (one small comment is the class names in the junit test need to be capitalized for all three classes . Client instead of client etc. nothing major, but a newbie may find themselves stuck.
Good work, folks like you keep all open source technologies marching forward.

Anonymous said...

Hi,
Very nice tutorial. Everything worked until the last part. I'm getting the index page but the links are not working.

I'm getting the following error message: HTTP Status 404 - /modelingagency/model.do

--------------------------------------------------------------------------------

type Status report

message /modelingagency/model.do

description The requested resource (/modelingagency/model.do) is not available.