| 看 清单 3，则会注意到此页面中的所有 Java 代码几乎都已被删除。它还使用了 JSTL（特别是 c:forEach 标记）来实现重复操作。注意 c:forEach 标记的参数是 ${phonebookEntries}。此对象的名称与配置主 页控制器时指定的命令名称相同。需要注意的另一个更改是调用 addentry-mvc.jsp 的 JavaScript 代码 。在本例中指定的操作是 /phonebook/addentry-mvc.act，它将映射到在后面部分中定义的 AddEntryFormController。另请注意，表单提交方法为 GET。同先前说明的一样，GET 将表示一个表单打 开。
清单 3. 做出更改来为主页启用 MVC
...
<html>
<script type="text/javascript">
function goToAddEntryPage()
{
document.myForm.action="/phonebook/addentry-mvc.act";
document.myForm.method="GET";
document.myForm.submit();
}
function setId(entryID, rowID)
{
document.myForm.entryID.value = entryID;
document.myForm.rowID.value = rowID;
}
function noRowSelected()
{
var entryID = document.myForm.entryID.value;
var rowID = document.myForm.rowID.value;
if (entryID == "" || rowID == "") {
return "true";
}
else {
return "false";
}
}
function goToModifyEntryPage(){
if (noRowSelected() == "true") {
alert("Please select an Entry to Modify");
return;
}
document.myForm.action="/phonebook/modifyentry-mvc.act";
document.myForm.method="GET";
document.myForm.submit();
}
function deleteEntry() {
if (noRowSelected() == "true") {
alert("Please select an Entry to Delete");
return;
}
else {
var retVal = confirm("Please click OK to confirm your deletion.
Click Cancel otherwise");
if (retVal != true) {
return;
}
}
document.myForm.action="/phonebook/deleteentry-mvc.act";
document.myForm.method="POST";
document.myForm.submit();
}
</script>
...
<form name="myForm" action="" method=post>
<!-- The table containing phone book contents. -->
<TABLE border="1" width="100%">
<TH width="5%" align=center>Select</TH>
<TH width="25%" align=center>Name</TH>
<TH width="15%" align=center>Home Phone</TH>
<TH width="15%" align=center>Work Phone</TH>
<TH width="15%" align=center>Cell Phone</TH>
<TH width="25%" align=center>Email</TH>
<c:forEach items="${phonebookEntries}" var="pbEntry">
<TR>
<TD align=center><input type=radio name="data_i"
alt="Select to Modi
|
