Using AJAX+J2EE to develop organization management system

Source: Internet
Author: User
Tags add include insert interface
ajax|j2ee| Institutional Management I. Overview

Ajax is a new technology that came out early this year, and is an abbreviation for asynchronous JavaScript and XML. It is a set of technologies for developing Web applications that enable browsers to provide users with a more natural browsing experience. The modification of the client Web page is asynchronous and incremental whenever an update is required.
In this way, Ajax greatly improves the user interface speed when submitting Web page content. There is no need to wait for the entire page to refresh in an AJAX-based application for long periods of time. The part of the page that needs to be updated is changed and, if possible, the update is done locally and asynchronously.

Java EE is an architecture used to develop distributed systems. It mainly uses Java classes to develop business entities. Connect the application server through a JSP.

This article develops an organization management small system, through this example to explain how to use Ajax to develop Web applications. The system has the function of adding, modifying and deleting the organization. At the same time to the organization to assign personnel, can add, modify, delete personnel.

   second, interface design

Tree structure is a kind of structural form commonly used in most software systems. Because of the hierarchical structure of the tree, the relationship between the superior and the clear, and the expansion of the contraction to express information convenient, the interface is also more beautiful, so we are keen to use this structure. The organization management is the general software basically has. Organization refers to the organization structure of a company. The group may include the subsidiary company and the department below. Employees belong to the company in which they are located. The interface of the system after running is as follows:


Orgmanager.htm is the main page of organization management. Web application interface design is very important. How to Layout, sample organization can directly reflect a person's design level.
Organizations mainly include tree structure, organization editor, staff editors, such as three large chunks, how to divide into three, but the general tree structure of the form often first two, tree-type structure of the exclusive piece, and another piece divided into the upper and lower two parts, above is the mechanism code, the following is the personnel code Solid can divide the page into the following diagram form:

Tree structure Area 1 Organization Code Area 2
Personnel Admin District 3

Obviously we do it through a table. This is a table with two rows and two columns, and the left column of row first to second merges the cells. The code is as follows:








TABLE border= "1" width= "100%" height= "100%"

We add a div to area 1 (cell) because the DIV can scroll dynamically and can be inserted into other controls. The DIV's ID is "Divtree" and the style is set to scroll automatically when it overflows, with a width and height of 100%, and a full range. The code is as follows:


We add a div to section 2 (cell) and insert a table in the Div. The control is dropped on the table, which is simple enough to say in detail.

We add a div to area 3 (cell). The ID of this div is "divcontent", and style set to vertical overflow automatically scrolling, wide and high are 100%, and full area, this div used to load personnel information; In the DIV, insert a table, the ID of this table is "Tblist", is used to input, show people rest and relax, Also insert some controls such as checkbox, text, select, and so on in this table. Description, the second column of the table is used to put the person's unique number, not shown. The code is as follows:










male female


[1] [2] [3] [4] [5] Next page



Related Article

Cloud Intelligence Leading the Digital Future

Alibaba Cloud ACtivate Online Conference, Nov. 20th & 21st, 2019 (UTC+08)

Register Now >

Starter Package

SSD Cloud server and data transfer for only $2.50 a month

Get Started >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.