The Structure of the Issue Tracking Sample Application

Article
06/14/2014

This content is no longer actively maintained. It is provided as is, for anyone who may still be using these technologies, with no warranties or claims of accuracy with regard to the most recent product version or service release.

The Issue Tracking sample application consists of a Web-based user interface and a Microsoft® SQL Server™ database. The primary pages used in the Issue Tracking application were created using Microsoft® Access data access pages. Data access pages provide a quick and easy way for you to create data-bound Web pages by specifying the database and fields to be displayed. Then, you can design the layout of the page easily using the data access page editor. For more information about data access pages, see the Access online documentation.

When these data access pages were created, they were extended using the Microsoft Script Editor. From within the Access data page designer, open the Script Editor by opening the Tools menu, pointing to Macro, and then clicking Microsoft Script Editor.

Default.htm

The Default.htm page provides a mechanism for redirecting the user to the main page, GridView.htm. The user simply navigates to the Web directory, which loads Default.htm, which in turn redirects to GridView.htm.

GridView.htm

The Grid View page is a data access page that uses a Microsoft® ActiveX® Hierarchical FlexGrid control (ModHFGrid) to display the list of issues. The data access page functionality specifies the underlying data source and data binding, while the ModHFGrid control provides an intuitive and attractive interface for displaying issues.

Data Source in GridView.htm

Data access pages define the underlying database query based on the data-bound controls placed on the page. Although the ModHFGrid control is used to display the issues, the data access page must contain controls bound to every field the user might want to display in the grid.

The Grid View page is bound to the view named IssuesBaseView. This view brings together the main view (IssuesView) and all of the lookup fields, such as Priority and Category, into one flat result. This makes it possible for the grid to display any combination of the fields in the main table and the lookup tables.

When the data access page was first created, every field from the view was dragged onto the Grid View page, so the source of the query returned all fields.

The ActiveX ModHFGrid control used to display the issues was placed on the page. VBScript was added to the page to bind the grid data source to the data source of the data access page, which is the MSODSC control.

set IssuesGrid.DataSource = MSODSC.DataPages.Item(0).Recordset

This is executed in the subroutine Sub Grid_SetupBinding within the GridView.htm page.

Views Support in GridView.htm

The Grid View page includes VBScript that supports displaying different views in the ModHFGrid control. The views define what columns are displayed in the grid, along with the width of each field, a filter specifying what records to display, and a sort order for specifying the order of the records.

The view information is stored in two application tables. The IssuesGridView table stores a view definition that includes the fields, filter, and sort order for the view. The IssuesProperties table stores user information about each view. For example, each user in the system can have a different set of field widths per view. Also stored here is the last view a user was viewing, so, upon start up, that view can be restored.

The interface for selecting, creating, and modifying the views is provided by the Views.htm and CustomizeView.htm files. Views.htm is displayed within the GridView.htm page by dynamically adding an IFRAME to the Grid View page when the user clicks the View button on the toolbar. This is accomplished using the Sub showDropDown subroutine, which provides a generic function for displaying an inline page.

showDropDown('views.htm',40)

The first parameter specifies what page is to be displayed, and the second parameter specifies the height in pixels that should be used to display the page.

When the Views page is shown, the user can select different views from a combo box in the Views.htm page. When the user selects a view, VBScript in Views.htm makes a call to GridView.htm to apply the selected view. This is done using the DHTML execScript method.

Sub cboView_onChange
   window.Parent.execScript "SaveCurrentView ""Issues""","VBScript"
   window.Parent.execScript "ApplyView ""Issues""," + cboView.value +   ",""""", "VBScript"
   window.Parent.execScript "SaveCurrentViewUsed   ""Issues""","VBScript"
End Sub

Within the GridView.htm, there are four main VBScript subroutines that apply, plus the save view settings.

Function	Description
`Function GetLastViewUsed (strBaseTable)`	Returns the ID of the view last displayed by the current user.
`Sub SaveCurrentViewUsed (strBaseTable)`	Saves the ID of the view currently in use to the database.
`Sub ApplyView (strBaseTable, intViewID, strInteractiveFilter)`	Used to apply the settings of a previously saved view.
`Sub SaveCurrentView (strBaseTable)`	Saves the settings of the current view to the database.
`Sub RefreshGrid()`	Used to refresh the grid with any changed data. Causes the view to be re-applied using the ApplyView routine.

For a more information about views, see "SQL Views" in the SQL Server Books Online.

Filter Support in GridView.htm

The Grid View page includes a feature that makes it possible for the user, interactively, to filter the items displayed in the grid. The interface for defining and applying the filter is provided by the InteractiveFilter.htm file. It is displayed in the same manner as the views support by adding dynamically an IFRAME to GridView.htm when the user clicks the Filter button on the toolbar. This is accomplished using the Sub ShowDropDown routine.

showDropDown('interactivefilter.htm', 290)

The first parameter specifies the page to be displayed, and the second parameter specifies the height in pixels that should be used to display the page.

When the user has defined the filter on the Filter page, the new filter is applied by executing a DHTML execScript method within the InteractiveFilter.htm file.

window.parent.execScript("ApplyFilter(\"" + output.replace(/\\/g, '\\\\').replace(rxDoubleQuotes, '\\"') + "\")");

In GridView.htm, the routine to execute the filter is the ApplyFilter routine.

Function	Description
`Sub ApplyView(strInteractiveFilter)`	Applies the specified filter to the records displayed within the grid.

Share via