CA2352996A1 - List display and management in a web browser environment - Google Patents
List display and management in a web browser environment Download PDFInfo
- Publication number
- CA2352996A1 CA2352996A1 CA002352996A CA2352996A CA2352996A1 CA 2352996 A1 CA2352996 A1 CA 2352996A1 CA 002352996 A CA002352996 A CA 002352996A CA 2352996 A CA2352996 A CA 2352996A CA 2352996 A1 CA2352996 A1 CA 2352996A1
- Authority
- CA
- Canada
- Prior art keywords
- user
- list
- page
- definition
- input
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Abandoned
Links
- 230000009471 action Effects 0.000 claims abstract description 68
- 230000004044 response Effects 0.000 claims abstract description 22
- 238000000034 method Methods 0.000 claims abstract description 14
- 238000004590 computer program Methods 0.000 claims description 14
- 230000006870 function Effects 0.000 claims description 8
- 238000012217 deletion Methods 0.000 claims description 5
- 230000037430 deletion Effects 0.000 claims description 5
- 230000004048 modification Effects 0.000 claims description 4
- 238000012986 modification Methods 0.000 claims description 4
- 238000011161 development Methods 0.000 description 5
- 238000007726 management method Methods 0.000 description 5
- 230000008569 process Effects 0.000 description 5
- 238000007792 addition Methods 0.000 description 2
- 238000013459 approach Methods 0.000 description 2
- 230000008859 change Effects 0.000 description 2
- 238000010586 diagram Methods 0.000 description 2
- 238000013479 data entry Methods 0.000 description 1
- 238000002716 delivery method Methods 0.000 description 1
- 230000007246 mechanism Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
- Information Transfer Between Computers (AREA)
Abstract
A graphical user interface and method for displaying a list or other object in a web browser-based environment is provided. The graphical user interface display's a page to the user within a defined window comprising a list and first input means actuateable by the user to select one of a set of editing actions. The page is altered within the same defined window in response to selection of an editing action to display a second input means for input entry relating to the selected editing action.
The list is edited according to the selected editing action and input entry such that upon completion of input entry, the page is further altered within the same defined window so that the page now comprises the edited list and the first input means.
The list is edited according to the selected editing action and input entry such that upon completion of input entry, the page is further altered within the same defined window so that the page now comprises the edited list and the first input means.
Description
LIST DISPLAY AND MANAGEMENT IN A WEB
BROWSER ENVIRONMENT
Field of the Invention This invention generally relates to computer systems, and in particular graphical user interfaces for the display of data in a web-based environment.
Background of the Invention Systems developed for web-based electronic commerce will frequently provide prompts to encourage 1o customers or users of a website to generate or maintain lists of items. In the case of a retail web environment, a website may permit customers to define lists of products for purchase. Other lists may also be created to reflect information about the customer. A list of products for purchase may include the product name, quantity ordered, or a delivery location. Lists of customer information may include addresses for shipping and invoicing, preferred delivery methods, and contact preferences. In an electronic commerce service provider environment, the lists created by the user may be lists of attributes of various products in a relational database to be provided on an electronic commerce website. The lists may be resident on the user's computer or on the web server.
Lists presented to a user by a web browser may be created in different ways.
For example a database may provide data in list format in answer to a query, a list may be generated by the user entering data 2o directly, or an application may generate a list as part of its function.
Once a list has been generated, it is often the case that a user is able to manage the list. The system in the web-based environment will provide tools to permit the user to edit the list (to carry out changes, additions, and deletions to items in the list).
A common way to permit a user of a web-based system to manage a list is to provide functionality to permit the list to be displayed on a web page by a web browser together with a button or some other graphical input device to permit the user to select a list-editing action. When the user selects one of these list-editing actions, a second web page is displayed to the user.
This second page includes a mechanism to permit the user to specify and provide input (for example to provide data values) for the selected list-editing action. In this prior art approach to list management, the second web page is displayed by launching another web browser process. Because the first and second processes are independent, however, in a web browser display the second window will not remain layered over the first (i.e. "on top") if the user activates another different window.
This is an inherent trait in web browser environments, and. is generally not experienced in a Windows-based application. If the user does not realize that the second window is merely obscured, he or she may return to the first window and re-select the editing action again, causing yet another web page to be generated in yet another web browser process. The creation of such multiple and unwanted web browser processes is potentially confusing for users, especially for novice users.
An alternative prior art approach is to display the list on a web page together with a GUI input device for selecting an editing action and for entering values to define i:he editing action. Although they are displayed together with the list at all times, the user is not able to select a list-editing action until the user has entered all values or data needed to define the selected list-editing action. This is problematic because users, especially novice users, often prefer "action" to data entry. As a result, the list-editing action will be selected by the user before the appropriate required input data has been entered. The user must then be prompted to complete the entry of data.
It is therefore desirable to provide a web-based graphical user interface for managing lists which will present choices to the user in a sequential and non-confusing manner.
Summary of the Invention According to an aspect of the invention there is provided an improved display and modification of list data in a web-based environment.
According to another aspect of the invention, there is provided a method of displaying a list to a user in a web browser-based environment, including the steps of:
displaying to the user a page in a defined window of the web browser environment, the page including a list and a first user-input means actuateable by the user to select one of a set of defined list-editing actions;
displaying the page in an altered state in the defined window of the web browser environment in response to user actuation of the first user-input means to select one of the set of defined list-editing actions, the page in the altered state including second user-input means actuateable by the user for input entry relating to the selected list-editing action;
editing the list in response to the selected list-editing action and the input entered by the user; and displaying the page in a further altered state in the .defined window of the web browser 1 o environment in response to completion of user input entry such that the page in the further altered state includes the list as modified to reflect the input entered by the user and includes the first user input means.
According to another aspect of the invention, there is provided the above method wherein the set of defined list-editing actions includes addition to the list, modification of the list, and deletion from the list.
According to another aspect of the invention, there is provided an article including a computer usable medium tangibly embodying a computer readable web page definition for carrying out the above methods.
According to another aspect of the invention, there is provided an article including a computer usable 2o medium tangibly embodying a computer readable means including a web page definition including:
a first definition component for generating, within a defined window in the browser environment, a first view from th.e web page definition, the first view including a list and a first user-input means, the first user-input means being actuateable by the user to select from a se;t of defined list-editing actions;
a second definition component for generating, within the defined window, a second view from the web page definition, the second view being generated in response to the user selecting from the set of defined list-editing actions, the ____~_~ _ _.____.__...._~.~~,..~.~,~ ~,_~ .~..~. ___r"-second view including second user-input: means actuateable by the user for input entry relating to the user-selected list-editing actions;
a third definition component for invoking a function to carry out the user-selected list-editing actions; and a fourth definition component for generating, within the defined window, a modified first view from the defined web page in response to the completion of user input entry such that the modified :first view includes the list as defined after the user-selected list-editing actions have been carried out.
According to another aspect of the invention, there is provided the above article wherein the web l0 page definition is defined in the hypertext markup language and the JavaScript language.
According to another aspect of the invention, there is provided a computer program product including a computer usable medium tangibly embodying computer readable program code means for defining page definitions for use in a web browser-based environment, the computer readable program code means including means for generating a web page definition, the web page definition including:
a first definition component for generating, within a defined window in the browser environment, a first view from th.e web page definition, the first view including a list and a first user-input means, the first user-input means being actuateable by the user to select from a se>t of defined list-editing actions;
2o a second definition component for gener;~ting, within the defined window, a second view from the web page definition., the second view being generated in response to the user selecting from the se;t of defined list-editing actions, the second view including second user-input means actuateable by the user for input entry relating to the user-selected list-editing actions;
a third definition component for invoking a function to carry out the user-selected list-editing actions; and a fourth definition component for generating, within the defined window, a modified first view from the defined web page in response to the completion of user input entry such that the modified :first view includes the list as defined after the user-selected list-editing actions have been carried out, and the computer readable program code means including, code means for user definition of a set of characteristics for the list, and code means for user definition of the set of list-editing actions.
According to another aspect of the invention, there is provided the above computer program product in which the computer readable program code means further includes code means for user definition of the second user-input means.
1 o According to another aspect of the invention, there is provided the above computer program product further including means for providing the web page definition to a local web browser-based environment by a remote web server.
According to another aspect of the invention, there is provided a graphical user interface for displaying an object to a user in a web browser-based environment, the graphical user interface including:
means for displaying a page to the user within a defined window, the page including an obj ect;
means for displaying a first user-input means on the. page, the user-input means being actuateable by the user to select from a set of defined object-editing actions;
2o means for altering the page being displayed to the user within the defined window in response to user selection from the defined object-editing actions, the altered page being displayed within the defined window and including second user-input means actuateable by the user for input entry relating to the selected object-editing action;
means for editing the object in response to the entered input; and means for restoring the view of the page being displ;~yed to the user within the defined window in response to the completion of input entry such that the further altered page includes the edited object and the first user-input means.
According to another aspect of the invention, there is provided the above a computer program product including a computer usable medium tangibly embodying computer readable program code means for providing the above graphical user interface to a local web browser-based environment by a remote web server.
According to another aspect of the invention, there is provided the above computer program product in which the means for altering the page and the means for restoring the view of the page are provided by the remote web server in a JavaScript executed by the local web browser-based 1 o environment.
According to another aspect of the invention, there is provided the above computer program product in which the first user-input means and the second user-input means are defined in hypertext markup language definitions provided by the remote web server and which the definitions are parsed by the local web browser-based environment.
Brief Description of the Drawings In the accompanying drawings which illustrate the invention by way of example only, Figure 1 is a screen shot showing a first view of an example web page generated by the preferred embodiment of the present invention.
2o Figure 2 is a screen shot showing a second view of the example web page generated by the preferred embodiment of the present invention.
Figure 3 is a screen shot showing a third view of the example web page generated by the preferred embodiment of the present invention.
Figure 4 is a block diagram representing a page of code of the preferred embodiment of the present invention.
Detailed Description of the Invention Figures 1 though 3 are sequential screen shots showing the display of an example web page 10 defined to implement the graphical user interface for list management of the preferred embodiment.
Referring to Figure 1, a first view of web page 10 is shown. Web page 10 is shown in Figure 1 as displayed in a web browser window 12. The display of web page 10 is carried out using techniques well known in the art. As will be appreciated by those skilled in the art, web page 10 has an associated definition. In the example, of web page 10, the definition is such that different graphical elements components will be displayed on the page in response to different user inputs. The display of these graphical elements is described in further detail, below.
to As displayed in Figure 1, web page 10 comprises a list generally indicated at 20, including a header record 22, and two data records 24, 26. The first field in list records 22, 24, 26 includes check boxes 22a, 24a, 26a, which may be checked or unchecked by the user to indicate which records are to be subject to a later-selected list editing function. In this particular embodiment, the data records in list 20 have product attribute fields 24b, 26b, relationship fields 24c, 26c, and value fields 24d, 26d.
Header record 22 is provided with corresponding titles 22b, 22c, and 22d. For clarity, reference to editing or editing functions generally describes the user options for managing the list data, which in Figure 1 include the options to "Add", "Change", or "Delete" an item. Thus example web page 10 shown in Figure 1 further includes graphical user input buttons 32, 34, and 36, corresponding to these list-editing actions "Add", "Change", and "Delete", respectively. Other list-editing actions 2o may also be provided and appropriate buttons may be displayed.
According to the web page definition of the preferred embodiment, when the user actuates one of the buttons for list-editing actions 32, 34, or 36, the display fo:r web page 10 is modified to reflect the list-editing action selected by the user.
Figure 2 shows the example of a second view of web page 10 displayed after the user has selected the "Add" list-editing action 32 in Figure 1 by selecting button 32. Web browser window 12 in Figure 2 represents the same web browser window 12 as shown in Figure 1. As may be seen, list 20 continues to be displayed in web page 10 displayed in Figure 2, although the list is shifted slightly downwards on the page as displayed in Figure 2. Web page 10 in this second view as illustrated in Figure 2 no longer includes buttons 32, 34, 36. Web page 10 shown in Figure 2 includes input fields shown as product attribute field 44a, relationship field 44b, anal value field 44c.
The second view of web page 10 in Figure 2 permits the user to fill in data in fields 44a, 44b, and 44c, and to then actuate button 46, labelled "Update list". Figure 2 shows user input "size", "is'° and "large" in input fields 44a, 44b and 44c, respectively. By defining web page 10 such that a tailored page is displayed after one ofthe list-editing buttons 32, 34, 36 is selected, the user is presented with a limited set of input fields and buttons that relate to the editing action selected. In the example of Figure 2, these are input fields 44a, 44b, 44c and buttons 46, 48. The user continues to view web page 10 in web browser window 12. The graphical user interface of the preferred embodiment 1 o therefore provides a straightforward manner for the user to select and carry out a list-editing action on the list being displayed. The alternative actuation of button 48, labelled "Cancel", has the effect of cancelling any user-entered input into fields 44a, 44b, or 44Ec.
In the example web page definition whose display is presented i.n Figure 2, once the appropriate data is filled in by the user in fields 44a, 44b, 44c and Update List button 46 is selected, the web page definition causes newly entered data to be merged with the e~;isting list data. Figure 3 shows the display of web page 10 after the list is updated, shown in browser window 12.
As may be seen, the display of web page 10 in Figure 3 is a modified version of the i:irst view, similar in format to Figure 1. In Figure 3, however, list 20 now includes the merged data record 28.
Thus, it can be seen that specific list-editing input means are f~isplayed on web page 10 only when 2o needed. Different input components are selectively displayed on web page 10 by the web browser refreshing or redisplaying web page 10, rather than invoking; a separate web browser process to present different fields and choices to the user.
It will be appreciated that the file or data being managed by the invention is not limited to simple lists such as those illustrated in the example of Figures 1 through 3. Other more complex lists may be managed using the preferred embodiment.
In general, the method for managing a list or other data file using a graphical user interface list management system in accordance with the present invention is as follows: the user is presented with a list of items on a web page, together with buttons, or other GUI input tools, for editing the list. The user is able to select an editing action using the GUI input tools. The web page is defined such that, once the user selection is made, the web page is redisplayed by i;he browser in the same web browser window including further input buttons and input boxes (or oi:her GUI input tools) corresponding to the selected list-editing action. The user is then able to actuate the further GUI input tools to permit and direct the list editing action to be carried out (or <alternatively cancels the list-editing action). The user may input data values or specify which entries in the list will be subject to an editing action (for example a sort or a deletion). The web pale definition is such that user input entry is acted on to carry out the editing action determined t>y the user. The web page is then redisplayed in the original format, with the browser window showing the GUI
input tools for editing the list, as well as the updated list of items.
Turning back to the example of the figures, web page 10 has a definition such that it will be displayed by a user's web browser program as described above. A~schematic representation of the definition of example web page 10 is shown in the block diagram of Figure 4.
In the preferred embodiment, the definition of web page 10 is a hypertext markup language file that includes JavaScript code. As will be apparent to those skilled in the art, the GUI of the preferred embodiment may be implemented using web page definitions based on other languages. The web page definition of the preferred embodiment will provide thf; display features and functionality described above.
Figure 4 shows definition of web page 10 as code 50 which includes program code block 54 (defined 2o in a programming language such as JavaScript); embedded within HTML blocks 52, S6. HTML
block 56 comprises instructions which cause the web browser program to display list 20 and input buttons 32, 34, 36. In the preferred embodiment, HTML block. 56 includes calls to functions in the programming language block 54, not shown individually, corresponding to the list-editing actions selectable by buttons 32, 34, or 36.
As is known in the art, code 50 is received as input by a user's web browser program (usually running on the user's local computer or network) upon a request sent to a web server (not shown).
HTML blocks 52, 56 and programming block 54 are therefore maintained in the memory associated with the user's web browser program. The data accessed to pf;cmit list 20 to be displayed on web CA9-2000-0081 g page 20, however, does not necessarily have to be maintained in the same memory. It may be stored on the remote web server and the page of code 50 may further comprise instructions to the web server to include the separate list-related data when the page .'i0 is sent to the user's web browser program.
The preferred embodiment described above may be implemented using development tools which permit a developer to access a framework or template defmi~ng the GUI. In an object oriented development environment such a framework may be easily instantiated to provide different lists and list editing actions that might be required by the developer. The implementation of such development tools will be apparent to those skilled in the ant, given the GUI
description set out 1o above. Such a development tool permits a developer to specify list and list editing action characteristics. The development tool generates a web page definition to permit the display and management of the list to be carried out as described above.
Although a preferred embodiment of the invention has been described herein, it will be readily appreciated by those skilled in the axt that variations may be made thereto, without departing from the spirit of the invention or the scope of the appended claims.
BROWSER ENVIRONMENT
Field of the Invention This invention generally relates to computer systems, and in particular graphical user interfaces for the display of data in a web-based environment.
Background of the Invention Systems developed for web-based electronic commerce will frequently provide prompts to encourage 1o customers or users of a website to generate or maintain lists of items. In the case of a retail web environment, a website may permit customers to define lists of products for purchase. Other lists may also be created to reflect information about the customer. A list of products for purchase may include the product name, quantity ordered, or a delivery location. Lists of customer information may include addresses for shipping and invoicing, preferred delivery methods, and contact preferences. In an electronic commerce service provider environment, the lists created by the user may be lists of attributes of various products in a relational database to be provided on an electronic commerce website. The lists may be resident on the user's computer or on the web server.
Lists presented to a user by a web browser may be created in different ways.
For example a database may provide data in list format in answer to a query, a list may be generated by the user entering data 2o directly, or an application may generate a list as part of its function.
Once a list has been generated, it is often the case that a user is able to manage the list. The system in the web-based environment will provide tools to permit the user to edit the list (to carry out changes, additions, and deletions to items in the list).
A common way to permit a user of a web-based system to manage a list is to provide functionality to permit the list to be displayed on a web page by a web browser together with a button or some other graphical input device to permit the user to select a list-editing action. When the user selects one of these list-editing actions, a second web page is displayed to the user.
This second page includes a mechanism to permit the user to specify and provide input (for example to provide data values) for the selected list-editing action. In this prior art approach to list management, the second web page is displayed by launching another web browser process. Because the first and second processes are independent, however, in a web browser display the second window will not remain layered over the first (i.e. "on top") if the user activates another different window.
This is an inherent trait in web browser environments, and. is generally not experienced in a Windows-based application. If the user does not realize that the second window is merely obscured, he or she may return to the first window and re-select the editing action again, causing yet another web page to be generated in yet another web browser process. The creation of such multiple and unwanted web browser processes is potentially confusing for users, especially for novice users.
An alternative prior art approach is to display the list on a web page together with a GUI input device for selecting an editing action and for entering values to define i:he editing action. Although they are displayed together with the list at all times, the user is not able to select a list-editing action until the user has entered all values or data needed to define the selected list-editing action. This is problematic because users, especially novice users, often prefer "action" to data entry. As a result, the list-editing action will be selected by the user before the appropriate required input data has been entered. The user must then be prompted to complete the entry of data.
It is therefore desirable to provide a web-based graphical user interface for managing lists which will present choices to the user in a sequential and non-confusing manner.
Summary of the Invention According to an aspect of the invention there is provided an improved display and modification of list data in a web-based environment.
According to another aspect of the invention, there is provided a method of displaying a list to a user in a web browser-based environment, including the steps of:
displaying to the user a page in a defined window of the web browser environment, the page including a list and a first user-input means actuateable by the user to select one of a set of defined list-editing actions;
displaying the page in an altered state in the defined window of the web browser environment in response to user actuation of the first user-input means to select one of the set of defined list-editing actions, the page in the altered state including second user-input means actuateable by the user for input entry relating to the selected list-editing action;
editing the list in response to the selected list-editing action and the input entered by the user; and displaying the page in a further altered state in the .defined window of the web browser 1 o environment in response to completion of user input entry such that the page in the further altered state includes the list as modified to reflect the input entered by the user and includes the first user input means.
According to another aspect of the invention, there is provided the above method wherein the set of defined list-editing actions includes addition to the list, modification of the list, and deletion from the list.
According to another aspect of the invention, there is provided an article including a computer usable medium tangibly embodying a computer readable web page definition for carrying out the above methods.
According to another aspect of the invention, there is provided an article including a computer usable 2o medium tangibly embodying a computer readable means including a web page definition including:
a first definition component for generating, within a defined window in the browser environment, a first view from th.e web page definition, the first view including a list and a first user-input means, the first user-input means being actuateable by the user to select from a se;t of defined list-editing actions;
a second definition component for generating, within the defined window, a second view from the web page definition, the second view being generated in response to the user selecting from the set of defined list-editing actions, the ____~_~ _ _.____.__...._~.~~,..~.~,~ ~,_~ .~..~. ___r"-second view including second user-input: means actuateable by the user for input entry relating to the user-selected list-editing actions;
a third definition component for invoking a function to carry out the user-selected list-editing actions; and a fourth definition component for generating, within the defined window, a modified first view from the defined web page in response to the completion of user input entry such that the modified :first view includes the list as defined after the user-selected list-editing actions have been carried out.
According to another aspect of the invention, there is provided the above article wherein the web l0 page definition is defined in the hypertext markup language and the JavaScript language.
According to another aspect of the invention, there is provided a computer program product including a computer usable medium tangibly embodying computer readable program code means for defining page definitions for use in a web browser-based environment, the computer readable program code means including means for generating a web page definition, the web page definition including:
a first definition component for generating, within a defined window in the browser environment, a first view from th.e web page definition, the first view including a list and a first user-input means, the first user-input means being actuateable by the user to select from a se>t of defined list-editing actions;
2o a second definition component for gener;~ting, within the defined window, a second view from the web page definition., the second view being generated in response to the user selecting from the se;t of defined list-editing actions, the second view including second user-input means actuateable by the user for input entry relating to the user-selected list-editing actions;
a third definition component for invoking a function to carry out the user-selected list-editing actions; and a fourth definition component for generating, within the defined window, a modified first view from the defined web page in response to the completion of user input entry such that the modified :first view includes the list as defined after the user-selected list-editing actions have been carried out, and the computer readable program code means including, code means for user definition of a set of characteristics for the list, and code means for user definition of the set of list-editing actions.
According to another aspect of the invention, there is provided the above computer program product in which the computer readable program code means further includes code means for user definition of the second user-input means.
1 o According to another aspect of the invention, there is provided the above computer program product further including means for providing the web page definition to a local web browser-based environment by a remote web server.
According to another aspect of the invention, there is provided a graphical user interface for displaying an object to a user in a web browser-based environment, the graphical user interface including:
means for displaying a page to the user within a defined window, the page including an obj ect;
means for displaying a first user-input means on the. page, the user-input means being actuateable by the user to select from a set of defined object-editing actions;
2o means for altering the page being displayed to the user within the defined window in response to user selection from the defined object-editing actions, the altered page being displayed within the defined window and including second user-input means actuateable by the user for input entry relating to the selected object-editing action;
means for editing the object in response to the entered input; and means for restoring the view of the page being displ;~yed to the user within the defined window in response to the completion of input entry such that the further altered page includes the edited object and the first user-input means.
According to another aspect of the invention, there is provided the above a computer program product including a computer usable medium tangibly embodying computer readable program code means for providing the above graphical user interface to a local web browser-based environment by a remote web server.
According to another aspect of the invention, there is provided the above computer program product in which the means for altering the page and the means for restoring the view of the page are provided by the remote web server in a JavaScript executed by the local web browser-based 1 o environment.
According to another aspect of the invention, there is provided the above computer program product in which the first user-input means and the second user-input means are defined in hypertext markup language definitions provided by the remote web server and which the definitions are parsed by the local web browser-based environment.
Brief Description of the Drawings In the accompanying drawings which illustrate the invention by way of example only, Figure 1 is a screen shot showing a first view of an example web page generated by the preferred embodiment of the present invention.
2o Figure 2 is a screen shot showing a second view of the example web page generated by the preferred embodiment of the present invention.
Figure 3 is a screen shot showing a third view of the example web page generated by the preferred embodiment of the present invention.
Figure 4 is a block diagram representing a page of code of the preferred embodiment of the present invention.
Detailed Description of the Invention Figures 1 though 3 are sequential screen shots showing the display of an example web page 10 defined to implement the graphical user interface for list management of the preferred embodiment.
Referring to Figure 1, a first view of web page 10 is shown. Web page 10 is shown in Figure 1 as displayed in a web browser window 12. The display of web page 10 is carried out using techniques well known in the art. As will be appreciated by those skilled in the art, web page 10 has an associated definition. In the example, of web page 10, the definition is such that different graphical elements components will be displayed on the page in response to different user inputs. The display of these graphical elements is described in further detail, below.
to As displayed in Figure 1, web page 10 comprises a list generally indicated at 20, including a header record 22, and two data records 24, 26. The first field in list records 22, 24, 26 includes check boxes 22a, 24a, 26a, which may be checked or unchecked by the user to indicate which records are to be subject to a later-selected list editing function. In this particular embodiment, the data records in list 20 have product attribute fields 24b, 26b, relationship fields 24c, 26c, and value fields 24d, 26d.
Header record 22 is provided with corresponding titles 22b, 22c, and 22d. For clarity, reference to editing or editing functions generally describes the user options for managing the list data, which in Figure 1 include the options to "Add", "Change", or "Delete" an item. Thus example web page 10 shown in Figure 1 further includes graphical user input buttons 32, 34, and 36, corresponding to these list-editing actions "Add", "Change", and "Delete", respectively. Other list-editing actions 2o may also be provided and appropriate buttons may be displayed.
According to the web page definition of the preferred embodiment, when the user actuates one of the buttons for list-editing actions 32, 34, or 36, the display fo:r web page 10 is modified to reflect the list-editing action selected by the user.
Figure 2 shows the example of a second view of web page 10 displayed after the user has selected the "Add" list-editing action 32 in Figure 1 by selecting button 32. Web browser window 12 in Figure 2 represents the same web browser window 12 as shown in Figure 1. As may be seen, list 20 continues to be displayed in web page 10 displayed in Figure 2, although the list is shifted slightly downwards on the page as displayed in Figure 2. Web page 10 in this second view as illustrated in Figure 2 no longer includes buttons 32, 34, 36. Web page 10 shown in Figure 2 includes input fields shown as product attribute field 44a, relationship field 44b, anal value field 44c.
The second view of web page 10 in Figure 2 permits the user to fill in data in fields 44a, 44b, and 44c, and to then actuate button 46, labelled "Update list". Figure 2 shows user input "size", "is'° and "large" in input fields 44a, 44b and 44c, respectively. By defining web page 10 such that a tailored page is displayed after one ofthe list-editing buttons 32, 34, 36 is selected, the user is presented with a limited set of input fields and buttons that relate to the editing action selected. In the example of Figure 2, these are input fields 44a, 44b, 44c and buttons 46, 48. The user continues to view web page 10 in web browser window 12. The graphical user interface of the preferred embodiment 1 o therefore provides a straightforward manner for the user to select and carry out a list-editing action on the list being displayed. The alternative actuation of button 48, labelled "Cancel", has the effect of cancelling any user-entered input into fields 44a, 44b, or 44Ec.
In the example web page definition whose display is presented i.n Figure 2, once the appropriate data is filled in by the user in fields 44a, 44b, 44c and Update List button 46 is selected, the web page definition causes newly entered data to be merged with the e~;isting list data. Figure 3 shows the display of web page 10 after the list is updated, shown in browser window 12.
As may be seen, the display of web page 10 in Figure 3 is a modified version of the i:irst view, similar in format to Figure 1. In Figure 3, however, list 20 now includes the merged data record 28.
Thus, it can be seen that specific list-editing input means are f~isplayed on web page 10 only when 2o needed. Different input components are selectively displayed on web page 10 by the web browser refreshing or redisplaying web page 10, rather than invoking; a separate web browser process to present different fields and choices to the user.
It will be appreciated that the file or data being managed by the invention is not limited to simple lists such as those illustrated in the example of Figures 1 through 3. Other more complex lists may be managed using the preferred embodiment.
In general, the method for managing a list or other data file using a graphical user interface list management system in accordance with the present invention is as follows: the user is presented with a list of items on a web page, together with buttons, or other GUI input tools, for editing the list. The user is able to select an editing action using the GUI input tools. The web page is defined such that, once the user selection is made, the web page is redisplayed by i;he browser in the same web browser window including further input buttons and input boxes (or oi:her GUI input tools) corresponding to the selected list-editing action. The user is then able to actuate the further GUI input tools to permit and direct the list editing action to be carried out (or <alternatively cancels the list-editing action). The user may input data values or specify which entries in the list will be subject to an editing action (for example a sort or a deletion). The web pale definition is such that user input entry is acted on to carry out the editing action determined t>y the user. The web page is then redisplayed in the original format, with the browser window showing the GUI
input tools for editing the list, as well as the updated list of items.
Turning back to the example of the figures, web page 10 has a definition such that it will be displayed by a user's web browser program as described above. A~schematic representation of the definition of example web page 10 is shown in the block diagram of Figure 4.
In the preferred embodiment, the definition of web page 10 is a hypertext markup language file that includes JavaScript code. As will be apparent to those skilled in the art, the GUI of the preferred embodiment may be implemented using web page definitions based on other languages. The web page definition of the preferred embodiment will provide thf; display features and functionality described above.
Figure 4 shows definition of web page 10 as code 50 which includes program code block 54 (defined 2o in a programming language such as JavaScript); embedded within HTML blocks 52, S6. HTML
block 56 comprises instructions which cause the web browser program to display list 20 and input buttons 32, 34, 36. In the preferred embodiment, HTML block. 56 includes calls to functions in the programming language block 54, not shown individually, corresponding to the list-editing actions selectable by buttons 32, 34, or 36.
As is known in the art, code 50 is received as input by a user's web browser program (usually running on the user's local computer or network) upon a request sent to a web server (not shown).
HTML blocks 52, 56 and programming block 54 are therefore maintained in the memory associated with the user's web browser program. The data accessed to pf;cmit list 20 to be displayed on web CA9-2000-0081 g page 20, however, does not necessarily have to be maintained in the same memory. It may be stored on the remote web server and the page of code 50 may further comprise instructions to the web server to include the separate list-related data when the page .'i0 is sent to the user's web browser program.
The preferred embodiment described above may be implemented using development tools which permit a developer to access a framework or template defmi~ng the GUI. In an object oriented development environment such a framework may be easily instantiated to provide different lists and list editing actions that might be required by the developer. The implementation of such development tools will be apparent to those skilled in the ant, given the GUI
description set out 1o above. Such a development tool permits a developer to specify list and list editing action characteristics. The development tool generates a web page definition to permit the display and management of the list to be carried out as described above.
Although a preferred embodiment of the invention has been described herein, it will be readily appreciated by those skilled in the axt that variations may be made thereto, without departing from the spirit of the invention or the scope of the appended claims.
Claims (15)
- The embodiments of the invention in which an exclusive right or privilege is claimed are described as follows:
A method of displaying a list to a user in a web browser-based environment, comprising the steps of:
a. displaying to the user a page in a defined window of the web browser environment, the page comprising a list and a first user-input means actuateable by the user to select from a set of defined list-editing actions;
b. displaying the page in an altered state in the said defined window of the web browser environment in response to user actuation of the first user-input means, the page in the altered state comprising second user-input means actuateable by the user for input entry relating to the user-selected list-editing actions;
c. editing the list in response to the user-selected list-editing actions and the input entered by the user; and d. displaying the page in a further altered state in the said defined window of the web browser environment in response to completion of user input entry such that the page in the further altered state comprises the list as modified to reflect the input entered by the user and comprises the first user input means. - 2. The method of claim 1 wherein the set of defined list-editing actions comprises addition to the list, modification of the list, and deletion from the list.
- 3. An article comprising a computer usable medium tangibly embodying a computer readable web page definition for carrying out the method of claim 1 or claim 2.
- 4. An article comprising a computer usable medium tangibly embodying a computer readable means comprising a web page definition, the web page, definition comprising:
a first definition component for generating, within a defined window in the browser environment, a first view from the web page definition, the first view comprising a list and a first user-input means, the first user-input means being actuateable by the user to select from a set of defined list-editing actions;
a second definition component for generating, within the said defined window, a second view from the web page definition, the second view being generated in response to the user selecting from the set of defined list-editing actions, the second view comprising second user-input means actuateable by the user for input entry relating to the user-selected list-editing actions;
a third definition component for invoking a function to carry out the user-selected list-editing actions; and a fourth definition component for generating, within the said defined window, a modified first view from the defined web page in response to the completion of user input entry such that the modified first view comprises the list as defined after the user-selected list-editing actions have been carried out. - 5. The article of claim 4 wherein the set of defined list-editing actions comprises addition to the list, modification of the list, and deletion from the list.
- 6. The article of claim 4 wherein the web page definition is defined in the hypertext markup language and the JavaScript language.
- 7. A computer program product comprising a computer usable medium tangibly embodying computer readable program code means for defining web pages for use in a web browser-based environment, the computer readable program code means comprising means for generating a web page definition, the web page definition comprising:
a first definition component for generating, within a defined window in the browser environment, a first view from the web page definition, the first view comprising a list and a first user-input means, the first user-input means being actuateable by the user to select from a set of defined list-editing actions;
a second definition component for generating, within the said defined window, a second view from the web page definition, the second view being generated in response to the user selecting from the set of defined list-editing actions, the second view comprising second user-input means actuateable by the user for input entry relating to the user-selected list-editing actions;
a third definition component for invoking a function to carry out the user-selected list-editing actions;
a fourth definition component for generating, within the said defined window, a modified first view from the defined web page in response to the completion of user input entry such that the modified first view comprises the list as defined after the user-selected list-editing actions have been carried out; and the computer readable program code means comprising, code means for user definition of a set of characteristics for the list, and code means for user definition of the set of list-editing actions. - 8. The computer program product of claim 7 in which the computer readable program code means further comprises code means for user definition of the second user-input means.
- 9. The computer program product of claim 7 or claim 8 in which the web page definition is defined in the hypertext markup language and the JavaScript language.
- 10. The computer program product of claim 7 or claim 8 further comprising means for providing the web page definition to a local web browser-based environment by a remote web server.
- 11. A graphical user interface for displaying an object to a user in a web browser-based environment, the graphical user interface comprising:
means for displaying a page to the user within a defined window, the page comprising an object;
means for displaying a first user-input means on the page, the user-input means being actuateable by the user to select from a set of defined object-editing actions;
means for altering the page being displayed to the user within the defined window in response to user selection from the defined object-editing actions, the altered page being displayed within the said defined window and comprising second user-input means actuateable by the user for input entry relating to the selected object-editing action;
means for editing the object in response to the entered input; and means for restoring the view of the page being displayed to the user within the said defined window in response to the completion of input entry such that the further altered page comprises the edited object and the first user-input means. - 12. A computer program product comprising a computer usable medium tangibly embodying computer readable program code means for providing the graphical user interface of claim 11 to a local web browser-based environment using a remote web server.
- 13. The computer program product of claim 12 in which the means for altering the page and the means for restoring the view of the page are provided by the remote web server in a script executed by the local web browser-based environment.
- 14. The computer program product of claim 13 wherein the first user-input means and the second user-input means are defined in definitions provided by the remote web server and which definitions are parsed by the local web browser-based environment.
- 15. The computer program product of claim 14 in which the script is JavaScript and the language is hypertext markup language.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CA002352996A CA2352996A1 (en) | 2001-07-12 | 2001-07-12 | List display and management in a web browser environment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CA002352996A CA2352996A1 (en) | 2001-07-12 | 2001-07-12 | List display and management in a web browser environment |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CA2352996A1 true CA2352996A1 (en) | 2003-01-12 |
Family
ID=4169453
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CA002352996A Abandoned CA2352996A1 (en) | 2001-07-12 | 2001-07-12 | List display and management in a web browser environment |
Country Status (1)
| Country | Link |
|---|---|
| CA (1) | CA2352996A1 (en) |
-
2001
- 2001-07-12 CA CA002352996A patent/CA2352996A1/en not_active Abandoned
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US8135758B2 (en) | Customizable, dynamic and on-demand database-informer for relational databases | |
| US7543005B1 (en) | Web site content change management | |
| US8412741B2 (en) | Product network management system and method | |
| US8307292B2 (en) | Method and apparatus for binding user interface objects to application objects | |
| US6404445B1 (en) | Method and system for modeling data | |
| US6484149B1 (en) | Systems and methods for viewing product information, and methods for generating web pages | |
| US7725501B1 (en) | System and method for rapid database application deployment and use | |
| US8396848B2 (en) | Customizable parameter user interface | |
| US5428738A (en) | Logical expression calculation interface | |
| US20020019837A1 (en) | Method for annotating statistics onto hypertext documents | |
| US20090282062A1 (en) | Data protection and management | |
| US20030227482A1 (en) | User interface builder | |
| US20090100371A1 (en) | User support system integrating faq and helpdesk features and faq maintenance capabilities | |
| US7818328B2 (en) | API for obtaining unambiguous representation of objects in a relational database | |
| JPH117419A (en) | Hypertext data processing system | |
| US20110246535A1 (en) | Apparatus and Method for Constructing Data Applications in an Unstructured Data Environment | |
| US5917498A (en) | Multi-object views in an object modeling tool | |
| US20030229646A1 (en) | Retrieving data for generating view components | |
| US8799256B2 (en) | Incorporated web page content | |
| US20040017397A1 (en) | Controllers and subcontrollers generating user interface displays | |
| CA2352996A1 (en) | List display and management in a web browser environment | |
| JP4439246B2 (en) | Document browsing control method, document browsing program, and document browsing program generation system | |
| EP0999505A2 (en) | Datebase query technique | |
| US20210240338A1 (en) | Method and mechanism for context driven alteration of ui artifacts instances behavior using expression based pluggable ui aspects | |
| JP2002230034A (en) | System and method for electronically categorizing and accessing resource information |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| EEER | Examination request | ||
| FZDE | Dead |