Chapter 19: Creating the Online Appraisal Application

In the previous chapter, you learned about the problems Electric Components, Inc. was having with its appraisal process. The development team had identified the functional specifications for an online appraisal application. In this chapter, you'll create the online appraisal application based on these functional specifications. You'll create components, such as employee validation and retrieval of performance information, and implement them in the form of a Web service.

Designing Web Pages for the Online Appraisal Application

In this chapter, you'll design Web pages for the online appraisal application using Dreamweaver MX as the authoring tool. All project files are stored in the ProjectFour directory, created under the wwwroot directory on the Web server. This will enable file management for the project. In this section, you'll design the controls on the Web pages. "The Workings of the Online Appraisal Application" discusses the ColdFusion code used to program the Web pages.

Designing the Employee Validation Page

This page will act as the startup page of the application. You can use Dreamweaver to create a basic HTML page and save it as Start.cfm in the specified project directory. This page will have the employee code, password, role, and the country where the employee is working. The role specifies the end user's function in the application. Because end users from different countries use different databases, the information related to the country determines which database should be used. The design of the Employee Validation page is shown in Figure 19.1.

Figure 19.1: The design of the Employee Validation page.

Add these controls to the Employee Validation page:

• One Form control to act as the container for the other controls on the page.

• One HTML Table control to hold the List and Text Field controls.

• Two Text Field controls to accept the employee code and password.

• Two List controls to accept the country and role of the employee.

• One Button control to validate the submitted information.

Set the properties of the Form control as listed in Table 19.1.

Table 19.1: Properties Assigned to the Form Control

Control	Property	Value
Form1	Name	EmpValidate
Form1	Action	CallValidate.cfm
Form1	Method	POST
Form1	ID	EmpValidate

Set the properties of the List controls as shown in Table 19.2.

Table 19.2: Properties Assigned to the List Controls

Control	Property	Value
List1	Name	empcode
List1	Size	20
List1	Type	Text
List1	Required	Yes
List1	Message	Employee code Is Essential
List2	Name	Password
List2	Size	20
List2	Type	Password
List2	Required	yes
List2	Message	Password Is Essential
List3	Name	country
List3	Size	1
List4	Name	approle
List4	Size	1

Refer to Table 19.3 to set the properties of the Button control.

Table 19.3: Properties Assigned to the Button Control

Control	Property	Value
Button1	Name	ValidateEmp
Button1	Type	Submit
Button1	Value	Validate For Entry

Designing the Appraisal Form Page

This page appears after the successful validation of the employee accessing the application. The Appraisal Form page is divided into two forms. The form on the top contains these controls: Target Description, Self Ratings, and Reviewer's Ratings. Applicants use this form for self assessment, while reviewers use it to rate employees on the given target for the current appraisal period. The form contains a button to update self ratings. The employee uses the second form, at the bottom of the page, to view the final score for a selected quarter and year. Figure 19.2 displays the design of the Appraisal Form page.

Figure 19.2: The design of the Appraisal Form page.

To design the Appraisal Form page shown in Figure 19.2, add these controls:

• An HTML Table control to hold the Text Field and List controls.

• One Text Field control to accept self ratings.

• One List control to select the quarter of the year.

• Three Button controls to update self ratings and view the annual and quarterly score and recommendation.

Set the properties of the Text Field control as listed in Table 19.4.

Table 19.4: Properties Assigned to the Text Field Control

Control	Property	Value
TextField1	Type	Text
TextField1	Name	#TargetID#
TextField1	Size	20
TextField1	Value	#SelfRating#
TextField2	Type	Text
TextField2	Name	Year
TextField2	Size	20
TextField2	Value	2001
TextField3	Type	Text
TextField3	Name	AppYear
TextField3	Size	20
TextField3	Value	2001

Set the properties of the List control as listed in Table 19.5.

Table 19.5: Properties Assigned to the List Control

Control	Property	Value
List1	Name	AppPeriod
List1	Size	1

Set the properties of the Button controls as shown in Table 19.6.

Table 19.6: Properties Assigned to the Button Controls

Control	Property	Value
Button1	Type	Submit
Button1	Name	UpdateAppraisal
Button1	Value	Update Self Rating
Button2	Type	submit
Button2	Name	btnView
Button2	Value	Show Annual Info
Button3	Type	submit
Button3	Name	btnView
Button3	Value	Show Quarterly Info

Designing the Reviewer Main Page

Reviewers use this page to assign targets to the selected employee. It contains options to view the performance of that particular employee over a period of time. The reviewer can also rate the employee's performance for the current appraisal period. Figure 19.3 displays the design of the Reviewer Main page.

Figure 19.3: The design of the Reviewer Main page.

To design the page shown in Figure 19.3, add these controls:

• An HTML Table control to hold the Text Field and List controls.

• One Text Field control to accept the appraisal year, and six Text Field controls in the lower part of the form to accept target descriptions.

• Two List controls to select an employee and select the appraisal period.

• Five Button controls to rate current targets, show annual and quarterly performances, evaluate annual performance, and save targets.

Set the properties of the Text Field controls as specified in Table 19.7.

Table 19.7: Properties Assigned to the Text Field Controls

Control	Property	Value
TextField1	Type	Text
TextField1	Name	AppYear
TextField1	Size	20
TextField1	Value	2001
TextField2	Type	Text
TextField2	Name	1
TextField2	Size	60
TextField3	Type	Text
TextField3	Name	2
TextField3	Size	60
TextField4	Type	Text
TextField4	Name	3
TextField4	Size	60
TextField5	Type	Text
TextField5	Name	4
TextField5	Size	60
TextField6	Type	Text
TextField6	Name	5
TextField6	Size	60
TextField7	Type	Text
TextField7	Name	6
TextField7	Size	60

Refer to Table 19.8 to set the properties of the List controls.

Table 19.8: Properties Assigned to the List Controls

Control	Property	Value
List1	Name	Selected_Employee
List1	Size	4
List1	Query	get_Employee_List
List1	Value	EmpCode
List1	Display	EmployeeName
List1	Required	Yes
List1	Message	Select an Employee Before Clicking the Action Buttons
List2	Name	AppPeriod
List2	Size	1

Set the properties of the Button controls as specified in Table 19.9.

Table 19.9: Properties Assigned to the Button Controls

Control	Property	Value
Button1	Type	Submit
Button1	Name	btnactivity
Button1	Value	Rate Target Achievements
Button2	Type	Submit
Button2	Name	btnactivity
Button2	Value	Show Annual Performance
Button3	Type	Submit
Button3	Name	btnactivity
Button3	Value	Show Quarterly Performance
Button4	Type	Submit
Button4	Name	btnactivity
Button4	Value	Evaluate Annual Performance
Button5	Type	Submit
Button5	Name	btnactivity
Button5	Value	Save Targets

Designing the Appraisal Reviewer Form Page

The Appraisal Reviewer Form page is used by the reviewer to rate the employee against targets assigned at the beginning of the appraisal period. This page also enables the reviewer to calculate the quarterly score, which evaluates the employee's annual performance. This page has a link that returns the end user to the Reviewer Main page.

Add the following controls to design the form shown in Figure 19.4:

• An HTML Table control to hold a Text Field control that stores the ratings given by the reviewer.

• A Checkbox control to accept the input from the reviewer to close the appraisal form and evaluate quarterly performance.

• A Button control to submit ratings for the targets.

• A hyperlink that takes the reviewer back to the main screen.

Figure 19.4: The design of the Appraisal Reviewer Form page.

Set the properties of the Text Field control as listed in Table 19.10.

Table 19.10: Properties Assigned to the Text Field Control

Control	Property	Value
TextField1	Type	Text
TextField1	Name	#TargetID#
TextField1	Size	20
TextField1	Value	#ReviewerRatings#

Set the properties of the Checkbox control as shown in Table 19.11.

Table 19.11: Properties Assigned to the Check Box Control

Control	Property	Value
Checkbox1	Type	checkbox
Checkbox1	Name	CloseAppraisal
Checkbox1	Value	Yes

Set the properties of the Button control as shown in Table 19.12.

Table 19.12: Properties Assigned to the Button Control

Control	Property	Value
Button	Type	Submit
Button	Name	RateAppraisal
Button	Value	Save Ratings for Targets

Another link on this form takes the reviewer to the Reviewer Main page.

Designing the Create Performance Policy Page

The administrator uses the Create Performance Policy page to determine the annual salary increments and recommendations for employees based on their performance. The scores are specified in a range. Each range has specific salary increments and recommendations. This page has a Drop-Down List control that specifies the country for which the policy is being decided.

Figure 19.5 displays the design of the Create Performance Policy page.

Figure 19.5: The design of the Create Performance Policy page.

To design the page shown in Figure 19.5, add these controls:

• An HTML Table control to hold four Text Field controls and one List control.

• A Button control to submit the created or recommended policies.

Set the properties of the Text Field control as listed in Table 19.13.

Table 19.13: Properties Assigned to the Text Field Controls

Control	Property	Value
TextField1	Type	Text
TextField1	Name	StartRange
TextField1	Size	15
TextField1	Maxlength	10
TextField1	Required	Yes
TextField1	Validate	Integer
TextFeild1	Message	Start Range Should Be Provided and It Should Be an Integer
TextField2	Type	Text
TextField2	Name	EndRange
TextField2	Size	15
TextField2	Maxlength	10
TextField2	Required	Yes
TextField2	Validate	Integer
TextField2	Message	EndRange Should Be Provided and It Should Be an Integer
TextField3	Type	Text
TextField3	Name	Salary
TextField3	Size	15
TextField3	Maxlength	10
TextField3	Required	Yes
TextField3	Validate	Integer
TextField3	Message	Salary Increment Should Be Provided and It Should Be in the Form of Integer
TextField4	Type	Text
TextField4	Name	Recommendation
TextField4	Size	50
TextField4	Maxlength	100
TextField4	Required	Yes
TextField4	Message	Recommendation Should Be Specified

Set the properties of List control as specified in the Table 19.14.

Table 19.14: Properties Assigned to the List Control

Control	Property	Value
List1	Name	Size
List1	Size	1

Set the properties of the Button control as specified in Table 19.15.

Table 19.15: Properties Assigned to the Button Control

Control	Property	Value
Button1	Type	Submit
Button1	Name	btnSave
Button1	Value	Create Policy

Designing the Performance and Recommendations Page

The Performance and Recommendations page shows the quarterly and annual scores and recommendations for a selected employee. This page can be viewed from the Appraisal Form page and the Reviewer Main page.

Most of the contents of this page are generated dynamically. A link at the bottom of the page returns the end user to the Appraisal Form page or the Reviewer Main page from which the page was called.

Figure 19.6 displays the design of the Performance and Recommendations page.

Figure 19.6: The design of the Performance and Recommendations page.