Raible's Wiki
Raible Designs AppFuseHomepage- Korean - Chinese - Italian - Japanese QuickStart Guide User Guide Tutorials Other ApplicationsStruts ResumeSecurity Example Struts Menu
Set your name in
UserPreferences
Referenced by
JSPWiki v2.2.33
Hide Menu |
This is version 58.
It is not the current version, and thus it cannot be edited. Part IV: Adding Validation and List Screen - Adding validation logic to the personForm so that firstName and lastName are required fields and adding a list screen to display all person records in the database.
About this TutorialThis tutorial will show you how to add Validation logic (client and server-side) to the personForm object using Struts' Validator. We'll also create a list screen using the Display Tag Library to display all the people in the database.
Table of Contents
Add XDoclet Validator tags to Person.java [#1]To use the Struts Validator, normally you have to write a validation.xml file by hand. If you're not using AppFuse, you also have to configure the Validator Plugin and error keys in your ApplicationResources_en.properties. For more information on this, see the Validation Made Easy Tutorial.Thanks to XDoclet, it's much easier - you just need to add a couple of @struts.validator tags to the Person class. Open it up (src/dao/**/model/Person.java) and modify the getFirstName() and getLastName() methods to include @struts.validator type="required" tags.
You can also add a msgkey attribute to this tag to override the default message key for this error.
The default key for type="required" is already errors.required, so I usually leave it to the default. This key is defined in web/WEB-INF/classes/ApplicationResources_*.properties. You'll notice that we put these tags on the getters of this class even though the XDoclet documentation says to put them on the setters. This is because we are generating our PersonForm.java - the template file (metadata/template/struts_form.xdt) takes care of putting these tags onto the setters in the generated file. Now if you save Person.java and run ant clean webdoclet, a validation.xml file will be generated in build/appfuse/WEB-INF/. It's contents should have now have an entry for "personForm".
To enable client-side validation in our personForm.jsp, a javascript JSP tag and script is required at the bottom of personForm.jsp. The following should already exist (thanks to viewgen) - you just need to uncomment it. The reason it's commented out is that the Validator will throw an exception if a formName is specified and no validation rules exist for it.
<html:javascript formName="personForm" cdata="false" dynamicJavascript="true" staticJavascript="false"/> <script type="text/javascript" src="<html:rewrite page="/scripts/validator.jsp"/>"></script> View JSP with validation added and test [#2]Now that you have Validation configured for this form, whenever this form is used in an action-mapping with validate="true", these rules will be applied. In the last tutorial, we added the "savePerson" action-mapping for PersonAction. The XDoclet tags for this action-mapping were:
So now, as long as your web/pages/personForm.jsp has <html:form action="savePerson">, validation should kick in when we try to save this form. Run ant db-load deploy, start Tomcat and go to http://localhost:8080/appfuse/editPerson.html?id=1. If you erase the values in the firstName and lastName fields and click the save button, you should get the following JavaScript alert. To make sure things are really working as expected, you can turn off JavaScript and ensure the server-side validation is working. This is easy in Mozilla Firebird (my favorite browser), just go to Tools → Options → Web Features and uncheck "Enable JavaScript". Now if you clear the fields and save the form, you should see the following: If you don't see these validation errors, there are a couple possibilities:
Add testGetPeople methods to DAO and Manager Tests [#3]To create a List screen (also called a master screen), we need to create methods that will return all the rows from our person table. Let's start by adding tests for these methods to our PersonDaoTest and PersonManagerTest classes. I usually name this method getEntities (i.e. getUsers), but you could also use getAll or search - it's really just a matter of personal preference.Open test/dao/**/dao/PersonDaoTest.java and add a testGetPeople method:
The reason I'm passing in a person object to the getPeople method is to allow for filtering (based on values in person) in the future. Add this parameter in your getPeople() method signature is optional, but the rest of this tutorial assumes you have done this. Now open test/service/**/service/PersonManagerTest.java and add a testGetPeople method:
In order for these tests to compile, you need to add the getPeople() method to the PersonDao and PersonManager interfaces, and their implementations. Add getPeople() method to DAO and Manager [#4]Open src/dao/**/dao/PersonDao.java and add the getPeople() method signature:
Now add the same method signature to src/service/**/service/PersonManager.java. Save all your files and adjust the imports in your tests. Next you need to implement the getPeople() method in your implementation classes. Open src/dao/**/dao/hibernate/PersonDaoHibernate.java and add the following method:
You'll notice here that nothing is being done with the person parameter. This is just a placeholder for now - in the future you may want to filter on it's properties using Hibernate's Query Language (HQL) or using Criteria Queries.
An example using a Criteria Query:
Now implement the getPeople() method in src/service/**/impl/PersonManagerImpl.java:
After saving all your changes, you should be able to run both tests by running the following:
If everything works - nice job! Now we need to add this retrieve all functionality to the web tier. Add testSearch() method to Action Test [#5]Open test/web/**/action/PersonActionTest.java and add the following method:
This class will not compile until you add the PERSON_LIST variable to the src/dao/**/Constants.java file.
Now save all your changes. You won't be able to run ant test-cactus -Dtestcase=PersonAction yet since PersonAction.search() does not exist (yet). Add search method to Action [#6]Open src/web/**/action/PersonAction.java and add the following XDoclet tag at the top - to forward to our list screen.
Now add the search method to the body of the PersonAction class.
Make sure Tomcat is stopped and run ant test-cactus -Dtestcase=PersonAction. Nice!
BUILD SUCCESSFUL Create personList.jsp and Canoo test [#7]There should already be a personList.jsp file in web/pages. If not, you can create it using viewgen. From the command-line, navigate to extras/viewgen and run ant -Dform.name=PersonForm. This will generate a PersonFormList.jsp in extras/viewgen/build.Once personList.jsp exists in web/pages, open it for editing. At the top of the file is a <bean:struts> tags that exposes the edit screen's forward as a page-scoped variable. This should already have a value of "editPerson".
Add this to the metadata/web/global-forwards.xml, as well as one for viewing the list. This way, they will get included in our struts-config.xml file.
The template you used to create this JSP has the column for the id property hard-coded, so XDoclet adds it twice. To remove this from personList.jsp, delete the following from this file:
Another thing you'll probably want to change is the plural form of the items you're listing. The generated name in this example is "persons" and it should probably be people. At or near line 31, you should have the following line: <display:setProperty name="paging.banner.items_name" value="persons"/> Change it to: <display:setProperty name="paging.banner.items_name" value="people"/> Finally, add the title and heading keys (personList.title and personList.heading) to web/WEB-INF/classes/ApplicationResources_en.properties. Open this file and add the following: # -- person list page -- personList.title=Person List personList.heading=All People As a reminder, the personList.title is what ends up in the brower's title bar (the <title> tag) and personList.heading will be put into an <h1> tag before any page content. At this point, you should be able to run ant clean deploy, start Tomcat and view this page in your browser at http://localhost:8080/appfuse/editPerson.html?method=Search. Now that we have a List Screen, let's change the pages that are displayed after adding and deleting a new Person. In src/web/**/action/PersonAction.java, change the mapping.findForward("mainMenu") in the save, delete and cancel methods to be:
You will also need to change verifyForward("mainMenu") to be verifyForward("viewPeople") in the testRemove method of test/web/**/action/PersonActionTest.java. Lastly, the Canoo tests "AddPerson" and "DeletePerson" need to be updated. Open test/web/web-tests.xml and change the following line in the "AddPerson" target: <verifytitle description="Main Menu appears if save successful" text=".*${mainMenu.title}.*" regex="true"/> to: <verifytitle description="Person List appears if save successful" text=".*${personList.title}.*" regex="true"/> Then in the "DeletePerson" target, change the following line: <verifytitle description="display Main Menu" text=".*$(mainMenu.title}.*" regex="true"/> to: <verifytitle description="display Person List" text=".*${personList.title}.*" regex="true"/> We use "viewPeople" instead of "list" so that the search method will be executed, rather than simply forwarding to the personForm.jsp (which the "list" forward points to). To test that displaying this page works, create a new JSP test in test/web/web-tests.xml:
You'll also want to add the "SearchPeople" target to the "PersonTests" target so it will be executed along with all the other person-related tests.
Now you can run ant test-canoo -Dtestcase=SearchPeople (or ant test-jsp if Tomcat isn't running) and hopefully it will result in "BUILD SUCCESSFUL". If so - nice work! Add link to menu [#8]The last step is to make the list, add, edit and delete functions visible to the user. The simplest way is to add a new link to the list of links in web/pages/mainMenu.jsp: NOTE: The other links in mainMenu.jsp don't use
Where menu.viewPeople is an entry in web/WEB-INF/classes/ApplicationResources_en.properties. menu.viewPeople=View People The other (more likely) alternative is that you'll want to add it to the menu. To do this, add the following to web/WEB-INF/menu-config.xml:
Make sure the above XML is inside the <Menus> tag, but not within another <Menu>. Then add this new menu to web/common/menu.jsp - which should now look as follows:
Now if you run ant clean deploy and start Tomcat, you should see something like the screenshot below. Notice that there is a new link on the left side (from mainMenu.jsp) and on the right in our menu (from menu.jsp). That's it!You've completed the full lifecycle of developing a set of master-detail pages with AppFuse - congratulations! Now the real test is if you can run all the tests in your app without failure. To test, stop tomcat and run ant clean test-all. This will run all the unit tests within your project. As a reminder, it should be easy to setup and test AppFuse from scratch using ant setup-db setup-tomcat test-all. Also, if you're looking for more robust examples - checkout StrutsResume.Happy Day!
BUILD SUCCESSFUL
Total time: 2 minutes 31 seconds If you'd like, you can download the files created in this tutorial. Attachments:
|