directory

1. System design

2. Database design

3. System management

4. User management

5. Business card management

This blog post will share a business card management system based on Struts2 framework. JSP engine is Tomcat9.0, database is MySQL5.5, integrated development environment is Eclipse IDE for Java EE Developers.

Business card management system mainly includes user management and business card management functions. User functions include: user registration, user login, password modification and basic information modification. Business card management mainly includes adding business cards, querying business cards, modifying business cards and deleting business cards.

I hope that through this study, friends can not only master the process, method and technology of Struts 2 application development, but also be familiar with the business requirements, design and implementation of business card management.

1. System design

1. System functional requirements

Business card management system mainly contains the following functions:

  • Non-registered users can register as registered users;
  • Successfully registered users can log in to the system.
  • Successful login users can add, modify, delete and browse their own customer’s business card information;
  • After successful login, users can view their basic information and change their passwords in the personal center.

2. System module division

After successful login, users can enter the management homepage (main.jsp) to manage their own customer business cards. System module division, as shown in the figure below.

Business card management system functions

2,Database design

The system connects to MySQL5.5 database by loading pure Java database driver. In MySQL5.5 database card, create two system-related data tables: userTable and cardinfo.

1. Database conceptual structure design

According to system design and analysis, the following data structures can be designed:

  • The user

Including user name and password, the registered user name is unique.

  • Business card

The value includes ID, name, phone number, email address, organization, position, address, Logo, and user. The ID is unique, user and 1. User “association. According to the above data structure, combined with the characteristics of database design, we can draw the database conceptual structure diagram as shown in the following figure.

Database conceptual structure diagram

Where ID is a positive integer and the value is a sequence increasing from 1.

2. Logical structure design of database

Translate the database conceptual structure diagram into the actual data model supported by MySQL database, that is, the logical structure of the database. The design of the user information table (UserTable) is as follows:

User information table

The design of the Card Information Table (CARDINFO) is shown in the following table:

Business card information sheet

3,System management

1. Import related JAR packages

Create a New Struts 2 application, cardManage, using EL expressions and JSTL tags in all JSP pages as much as possible, since the system uses a pure Java database driver to connect to MySQL5.5 and JSON data conversion. Therefore, you need to copy the corresponding JAR package to the WebContent\ web-INF \lib directory, as shown below:

The required jars

2. JSP page management

Due to space constraints, here only attached to the operation of the renderings, all implementation see the source code.

  • Management Homepage

Registered users to enter http://localhost:8080/struts2cardManage/login.jsp in the browser address bar to access the login page, after the success of the login, enter the management main page (main. JSP), main. The operation of the JSP effect as shown in the figure below:

Management Homepage

  • Program error page

When the Java program runs abnormally, the system executes the global page error.jsp.

  • No permission prompt page

If you do not login to the system successfully, the system does not have permission to add, delete, modify, or query a business card, prompting the nologin.jsp page.

  • Package file and configuration file management

The hierarchical structure of package files and configuration files of the system is shown as follows:

Package hierarchy diagram

The required package files are described as follows:

Action package This package is all the action classes in the system, including the action class for business card management and the action class for personal center. Conf folder The XML file in this folder is the configuration of all Action classes in the system. "Card. XML" is the configuration of the Action class for business card management, and "user. XML" is the configuration of the Action class for personal center. These XML files need to be included in the struts.xml file. Dao package The DAO package stores Java programs that implement database operations. BaseDao is a parent class that connects to the database. CardDao is a subclass of BaseDao for data access related to business card management. UserDao is another subclass of BaseDao, where data access for users is located. In addition, there is a file called "jdbc.properties" in the package, which is about the configuration of the database. Includes the driver class name, database URL, user name, and password. Entity package This package contains one entity class: Card, which encapsulates business Card information. This package has one interceptor class, LoginValidateInterceptor, which provides permission control. Util package The MyUtil class in this package is the utility class that gets a time string. The configuration file description is as follows: Struts. XML In software system development, modular design is the most common method. In order to facilitate management, the system is no exception, the configuration of different modules are put in different configuration files. These configuration files are then included in the struts.xml file. User.xml This configuration file is responsible for configuring user-specific actions. Card.xml This configuration file is responsible for configuring the Action related to the personal center. The wildcard character * is used to dynamically match the request name of the Action.Copy the code

4,User management

User functions include user registration, user login, password change, and basic information change.

1. Implementation of Action

The UserAction class handles the “Member Registration,” “Member Login,” “Safe Exit,” and “Personal center” functions.

2, registered

In the system default home page index.jsp, click the “Register” link to open the register page register.jsp, as shown in the picture below:

The sign-up page

After entering “Name” in the registration page shown in the deleteselect.jsp page, the system checks whether the “name” is available based on the Ajax asynchronous request path “JsonTest/isuse.Action.” Enter the valid user information and click Register to register the user.

3, login

On the default home page index.jsp, click the “Login” link to open the login page login.jsp, as shown in the picture below:

Login screen

After a user enters a name and password, the system authenticates the name and password. If both the name and password are correct, the login succeeds, the user information is saved to the session object, and the system administration homepage (main.jsp) is displayed. If the name or password is incorrect, an error message is displayed.

Click OK on the login page and submit the login request to action through the request path User /login.action. The configuration file user.xml processes login requests based on the request path by finding the login method of the corresponding Action class UserAction (Section 6.1).

4. Change the password

On the home page, click Change Password in the Personal Center menu to open the password change page updatepwd.jsp. The page effect is as follows:

Password Change page

On the password change page, enter new Password and Confirm new password, and click Change Password to submit the request to action through user/ updatepwd. action. The configuration file user.xml handles password change requests by finding the updatePwd method of the corresponding Action class UserAction (Section 6.1) based on the request path.

5. Basic Information

Click the “Basic Information” menu item of the “Personal Center” menu on the main page to open the basic information page userinfo.jsp. The page effect is as follows:

Basic Information Page

5,Business card management

System-specific JSP pages, CSS, and images are located in the WebRoot directory. In Section 3, you covered the database operations of the system, so this section just covers the IMPLEMENTATION of JSP pages and actions.

Business card management mainly includes adding business cards, querying business cards, modifying business cards and deleting business cards.

1. Implementation of Action

The CardAction class handles the “business card management” functions, including adding, modifying, deleting, querying, and so on.

2. Add business cards

After entering the name, phone number, E-mail address, company, position, address, and Logo of the business card, click Submit to add the business card. If successful, jump to the query page; If that fails, go back to the Add page. The addcard.jsp page realizes the input interface for adding business card information, as shown in the figure below:

Add business Card page

Click “Submit” in the figure above to submit the add request to the Action through “Card /addCard.action”. The configuration file card.xml handles the add function by finding the add method of the corresponding Action class CardAction (Section 5.1) from the requested path. Jump to query Action; Add failed return to add page.

3. Look for business cards

After successful login, the administrator enters the main page of the business card management system, and the query page querycards.jsp is initially displayed on the main page. The running effect of the query page is as follows:

The query page

Click the “Query business card” menu item in the “Business card Management” menu on the main page to open the query page querycards.jsp. The target address of the Hyperlink for the Query business Card menu item is an Action. The request path of this Action is Card/querycard. Action. The configuration file card. XML finds the query method of the corresponding Action class according to the request path to process the query function. In this method, query results are forwarded to different pages based on the action type (Modify query, Query, and Delete Query).

Click the “Details” hyperlink in querycards.jsp to open the detail.jsp page for business card details. The target address of the Details hyperlink is an Action. The request path for this Action is Card/selectacard.action. The configuration file card.xml finds the selectA method of the corresponding Action class according to the requested path to handle the query for a business card function. Forward the query results to the detail.jsp page. The business card details page is as follows:

Card details

4. Modify business cards

Click the Modify Business Card menu item under the Manage Business Cards menu on the main page to open the modify query page updateselec.jsp. The target address of the modify Business Card menu item hyperlink is an Action. Find the method query corresponding to the Action class CardAction, in which the query result is forwarded to the modify query page based on the Action type.

Click the “Modify” hyperlink in the updateselect.jsp page to open the updatecard.jsp page for modifying business card information. The target address of the modify hyperlink is an Action. Find the method selectA of the corresponding Action class CardAction, where the query results are forwarded to the updatecard.jsp page for display based on the Action type.

After entering the information to be modified, click “Submit” to submit the business card information to Action, find the method update of CardAction, and perform the modified service processing in the method. Enter the query business card. Failed to modify, return to updatecard.jsp page. The updateselect.jsp page looks like the following figure.

UpdateSelect. JSP page

The updatecard.jsp page should look like this:

UpdateCard. JSP page

 

5. Delete business cards

Click the Delete Business Card menu item in the Manage Business Cards menu on the main page to open the delete query page deleteselect.jsp.

The target address of the delete Business Card menu item hyperlink is an Action. Find the corresponding Action class CardAction method query, which forwards the query result to the deleteselect.jsp page based on the Action type, as shown in the following figure:

DeleteSelect. JSP page

Select the business card you want to delete from the check box in the figure above and click The Delete button. Submit the ID of the business card you want to delete to the controller Action. Find the delete method of the corresponding Action class CardAction. In this method, the business processing of batch deletion is performed based on the Action type.

Click the “Delete” hyperlink in the figure above, submit the card ID of the current row to the controller Action, and find the delete method of the corresponding Action class CardAction, where a single deleted business process is performed based on the Action type. After the deletion is complete, the query page is displayed.

Please pay attention to wechat public number, reply keyword: business card management system, obtain source ~

This article is compiled from:

1. “Java Web Development from Entry to Actual Combat”, Chen Hengjiangxue, chief editor

2. Tsinghua Computer School