Editable Display Tag Table
This page is designed to demonstrate how you can use the display tag to create editable rows of data. Most of the code in this page is JSP scriplets to do the Add/Update/Delete logic. This implementation only supports editing one record at a time.
Motivation for this exercise was gained from this implementation, which is a patch that never made it into the old display tag (version 0.8.5).
Using the "View Table Source" link below this table, you can see the JSP/HTML code that's used to render this table.
<%
String method = request.getParameter("method");
if (method == null) {
List testData = new ArrayList();
Map map1 = new TreeMap();
map1.put("id","1");
map1.put("firstName","Bill");
map1.put("lastName","Gates");
testData.add(map1);
Map map2 = new TreeMap();
map2.put("id","2");
map2.put("firstName","Scott");
map2.put("lastName","McNealy");
testData.add(map2);
Map map3 = new TreeMap();
map3.put("id","3");
map3.put("firstName","Bill");
map3.put("lastName","Joy");
testData.add(map3);
session.setAttribute( "test", testData);
} else {
// grab the testDate from the session
List testData = (List) session.getAttribute("test");
String useMe = request.getParameter("id");
if (useMe != null && method.equals("Delete")) {
// figure out which object it is and delete it
for (int i=0; i < testData.size(); i++) {
Map m = (TreeMap) testData.get(i);
String id = m.get("id").toString();
if (useMe.equals(id)) {
testData.remove(m);
%><div class="message">Delete succeeded!</div><%
break;
}
}
} else if (method.equals("Save")) {
// figure out which object it is and update it
for (int i=0; i < testData.size(); i++) {
Map m = (TreeMap) testData.get(i);
String id = m.get("id").toString();
if (useMe.equals(id)) {
m.put("firstName", request.getParameter("firstName"));
m.put("lastName", request.getParameter("lastName"));
testData.set(i, m);
%><div class="message">
<b><c:out value=" "/></b> updated successfully!
</div></h2><%
break;
}
}
} else if (method.equals("Add")) {
Map map4 = new TreeMap();
// generate a random number
Random generator = new Random();
String id = String.valueOf(generator.nextInt());
pageContext.setAttribute("id", id);
map4.put("id", id);
map4.put("firstName", "");
map4.put("lastName", "");
testData.add(map4);
%><c:redirect url="users-edit.jsp">
<c:param name="id" value=""/>
<c:param name="method" value="Edit"/>
</c:redirect>
<%
}
session.setAttribute( "test", testData);
}
%>
<c:set var="checkAll">
<input type="checkbox" name="allbox" onclick="checkAll(this.form)" style="margin: 0 0 0 4px" />
</c:set>
<form name="editForm" action="users-edit.jsp">
<c:if test="false">
<input type="button" onclick="location.href='users-edit.jsp'" class="button"
value="Reset List" />
</c:if>
<c:if test="false">
<input type="submit" name="method" value="Save" class="button" />
</c:if>
<input type="submit" name="method" value="Edit" class="button"/>
<input type="button" name="method" value="Add" class="button" onclick="location.href='?method=Add'" />
<input type="submit" name="method" value="Delete" class="button" />
<br /><br />
<display:table name="{firstName=Bill, id=3, lastName=Joy}" id="test" class="list">
<display:column style="width: 5%" title="${checkAll}">
<input type="checkbox" name="id" value="<c:out value="${test.id}"/>"
<c:if test="${param.id == test.id and param.method != 'Save'}">checked="checked"</c:if>
style="margin: 0 0 0 4px" onclick="radio(this)" />
</display:column>
<display:column title="First Name">
<c:choose>
<c:when test="${param.method == 'Edit' and param.id == test.id}">
<input type="text" name="firstName" style="padding: 0"
value="<c:out value="${test.firstName}"/>" />
</c:when>
<c:otherwise><c:out value="${test.firstName}"/></c:otherwise>
</c:choose>
</display:column>
<display:column title="Last Name">
<c:choose>
<c:when test="${param.method == 'Edit' and param.id == test.id}">
<input type="text" name="lastName" style="padding: 0"
value="<c:out value="${test.lastName}"/>" />
</c:when>
<c:otherwise><c:out value="${test.lastName}"/></c:otherwise>
</c:choose>
</display:column>
</display:table>
</form>