DE10116031A1

DE10116031A1 - Dynamic field check in HTML pages

Info

Publication number: DE10116031A1
Application number: DE10116031A
Authority: DE
Inventors: Reinhold Schneider; Yvonne Stoeckle; Tania Richter; Frank Grupe; Patrick Urban
Original assignee: Wincor Nixdorf GmbH and Co KG
Current assignee: Wincor Nixdorf International GmbH
Priority date: 2001-03-30
Filing date: 2001-03-30
Publication date: 2002-10-17
Also published as: DE10291391D2; WO2002079975A1; EP1374038A1

Abstract

The invention relates to a method for testing user inputs during display of pages formatted with active components by a markup language. According to said method, a control page (101-119) contains no data that are meant for the user and activates (110) a display page that optically dominates the control page. Said control page loads (117) a routine module which in turn activates a subroutine via the active components of the markup language. The display page comprises at least one input field whose field content is transferred via an event handling routine (105-108) to the routine module loaded by the control page, and influences the control.

Description

Die Erfindung betrifft die dynamische Feldprüfung in HTML- Seiten durch Computerprogramme.The invention relates to dynamic field testing in HTML Pages through computer programs.

In einer großen Anzahl von Computerprogrammen ist es zweck mäßig, sowohl die Anzeige von Daten als auch die Eingabe von Daten durch den Benutzer durch Seiten einer Markie rungssprache wie HTML zu gestalten, weil damit ein be triebssystemunabhängiges und leicht konfigurierbares System entsteht. Dies wird dadurch unterstützt, daß die Anzeige programme, im folgenden Browser genannt, eine Programmie rung innerhalb der Seite zulassen.It is useful in a large number of computer programs moderate, both the display of data and the input of data by the user through pages of a markie design language like HTML because drive system independent and easily configurable system arises. This is supported by the fact that the display programs, in the following called browser, a program Allow within the page.

Hierfür sind die Programmsysteme JavaScript, ActiveX und JAVA der Firmen Netscape, Microsoft und Sun allgemein be kannt und werden von den üblichen Browsern wie Netscape Communicator, Microsoft Internet Explorer oder Opera unter stützt. Insbesondere JavaScript unterstützt eine Ereignis behandlung, bei der in einem Formular durch das Verlassen eines Feldes ('onBlur') oder dessen Veränderung ('on- Change') ein JavaScript-Unterprogramm aufgerufen wird.The program systems are JavaScript, ActiveX and JAVA from Netscape, Microsoft and Sun in general knows and are from the usual browsers like Netscape Communicator, Microsoft Internet Explorer or Opera at supports. JavaScript in particular supports an event treatment when leaving in a form of a field ('onBlur') or its change ('on- Change ') a JavaScript subroutine is called.

Es ist bekannt, daß durch solche Unterprogramme die Inhalte solcher Formularfelder überprüft werden können. Die dazu verwendeten JavaScript Unterpogramme (Funktionen) sind mei stens Teil der das Formular enthaltenenen Seite, weil so der Programmierer sowohl das Formular als auch die Prüfpro gramme in derselben Quelle hat. Alternativ können die Java Script-Funktionen auch von einer beliebigen, durch eine URL bestimmten, Quelle geladen werden. Diese Technik wird be sonders bei Internet-Anwendungen verwendet. It is known that the contents of such subroutines such form fields can be checked. The one JavaScript sub-programs (functions) used are mei Most part of the page containing the form, because so the programmer both the form and the test pro gram in the same source. Alternatively, the Java Script functions also from any, through a URL certain source to be loaded. This technique will be especially used in internet applications.

In einigen Anwendungen ist diese Kopplung von Steuerung und Prüfung mit der Darstellung jedoch nicht erwünscht. Dies ist insbesondere immer dann der Fall, wenn die optische Ge staltung eine besondere Rolle spielt und daher von der Ab laufsteuerung getrennt sein soll. In diesen Fällen wird ei ne Methode benötigt, bei der die Ereignisbehandlung einer seits einheitlich und möglichst einfach angesprochen werden kann und andererseits eine komplexe Überprüfung und Steue rung möglich sein soll. Das gilt in besonderem Maße dann, wenn ein Browser für die Ablaufsteuerung bei einem Selbst bedienungsterminal oder Geldautomaten benutzt wird.In some applications, this is the coupling of control and Examination with the representation, however, not desired. This is in particular always the case when the optical Ge design plays a special role and therefore from the Ab run control should be separated. In these cases, egg ne method is required in which the event handling of a are addressed consistently and as simply as possible can and on the other hand a complex review and control tion should be possible. This is particularly true if a browser for self-control operating terminal or ATM is used.

Die Lösung besteht zunächst darin, Anzeigeseite und Steuer seite voneinander zu trennen, so daß in der Anzeigeseite nur noch Funktionsaufrufe für die Ereignisbehandlung er scheinen. Es zeigt sich, daß diese dann für alle Felder gleich gestaltet werden können und somit einfach handhabbar sind. Die Steuerseite hingegen lädt ein Programmmodul, des sen Unterprogramme komplexe Prüfungen durchführen können und das über dynamische Aktivierung von Unterprogrammen, gesteuert durch Konfigurationsdateien, frei konfigurierbar ist, ohne daß dies in der Gestaltung der Anzeigeseite sichtbar wird.The first solution is the display page and tax page to separate from each other, so that in the display page only function calls for event handling seem to be. It turns out that this then applies to all fields can be designed the same and therefore easy to handle are. The control side, however, loads a program module, the subroutines can perform complex tests and this via dynamic activation of subroutines, controlled by configuration files, freely configurable is without this in the design of the display page becomes visible.

Weitere Merkmale und Vorteile der Erfindung ergeben sich aus der folgenden Beschreibung, welche in Verbindung mit den beigefügten Zeichnungen die Erfindung an Hand eines Ausführungsbeispiels erläutert.Further features and advantages of the invention result from the following description, which in connection with the accompanying drawings, the invention using a Exemplary embodiment explained.

Es zeigenShow it

Fig. 1 den HTML-Code für eine Steuerseite, FIG. 1 shows the HTML code for a control page,

Fig. 2 den HTML-Code für eine Anzeigeseite, FIG. 2 shows the HTML code for an advertising page,

Fig. 3 den JAVA-Code für ein Prüfprogrammmodul. Fig. 3 shows the JAVA code for a Prüfprogrammmodul.

Die im folgenden dargestellten Ausführungsformen der Erfin dung beginnen zugunsten der Übersichtlichkeit mit einem we sentlich vereinfachten Beispiel, dessen Potential sich durch die darauf folgenden Erweiterungen darstellt. Insbe sondere sind Fehlerbehandlung und -Vermeidung nicht auspro grammiert.The embodiments of the invention shown below start with a we for the sake of clarity considerably simplified example, the potential of which through the subsequent extensions. in particular In particular, error handling and avoidance are not tried programmed.

Die in Fig. 1 bis Fig. 3 dargestellten Progammzeilen sind, wie üblich, mit vorgestellen Zeilennummern versehen, die der Bezugnahme dienen und nicht Teil der Programme sind.In Fig. 1 to Fig. 3 shown Progammzeilen are, as usual, is provided with pre-set line numbers that are used for reference and not forming part of the programs are.

In Fig. 1 ist der Programmcode für eine Steuerseite in HTML mit eingebettetem Javascript gezeigt. Die Zeilen 101 und 119 enthalten die in HTML vorgeschriebenen Klammerungen des Haupttteils. In den Zeilen 102 bis 115 sind JavaScript- Anweiseungen enthalten, die weiter unten besprochen werden. In Zeile 116 beginnt der Körper der Steuerseite, dem als Ereignisbehandlung der Funktionsaufruf 'init();' zugeordnet ist. Diese Funktion wird dann aufgerufen, wenn die Seite vollständig geladen ist und insbesondere die nachfolgend spezifizierte Aktivierung eines JAVA-Moduls abgeschlossen ist.In Fig. 1 the program code is shown for a control page in HTML with embedded JavaScript. Lines 101 and 119 contain the parentheses of the main part prescribed in HTML. Lines 102 through 115 contain JavaScript instructions that are discussed below. Line 116 begins the body of the control side, which receives the function call 'init ();' assigned. This function is called when the page is fully loaded and in particular the activation of a JAVA module specified below has been completed.

In den Zeilen 117 und 118 wird ein JAVA-Applet geladen und mit dem Bezeichner 'chkcode' versehen. Als Quelle wird in Fig. 1 eine absolute URL angegeben; alternativ kann auch durch 'src=chkcode.class' eine relative URL benutzt werden. Letztere wird dann von derselben Quelle geladen, von der auch die Steuerseite geladen wird.A JAVA applet is loaded in lines 117 and 118 and provided with the identifier 'chkcode'. An absolute URL is given as the source in FIG. 1; alternatively, a relative URL can also be used with 'src = chkcode.class'. The latter is then loaded from the same source from which the control side is loaded.

In den Zeilen 109 bis 111 wird die Funktion 'init()' defi niert, die gemäß Zeile 116 nach dem Laden der Seite und dem Laden des JAVA-Moduls aufgerufen wird. In diesem Beispiel wird lediglich durch die Funktion 'window.open()' eine wei teres Fenster geöffnet, in dem eine Anzeigeseite darge stellt wird, die über die relative URL 'chkUI1.html' gela den wird. Eine Referenz auf diese Seite wird in der Varia blen 'winShow' abgelegt.Lines 109 to 111 define the function 'init ()' niert, according to line 116 after loading the page and the Loading of the JAVA module is called. In this example is only a white by the function 'window.open ()' teres window opened, in which a display page Darge is placed via the relative URL 'chkUI1.html' that will. A reference to this page is in the Varia blen 'winShow' filed.

Eine solche Anzeigeseite ist als Beispiel in Fig. 2 darge stellt. Sie besteht in bekannter Art aus der Klammerung in den Zeilen 200 und 213, einer Überschrift in Zeile 202 und einem Formular in den Zeilen 203 bis 212. Das Formular be steht aus festem Text in den Zeilen 206, 209 und 211 sowie drei Feldern in den Zeilen 204, 207 und 210 sowie einer Schaltfläche in Zeile 212. Das Eingabefeld von Zeile 204 enthält einen Bezeichner 'Amount' und als Ereignissteuerung bei Änderung des Feldes den Funktionsaufruf 'opener.checkField(this.name, this.value);'.Such a display page is shown as an example in Fig. 2 Darge. It consists of the brackets in lines 200 and 213, a heading in line 202 and a form in lines 203 to 212 in a known manner. The form consists of fixed text in lines 206, 209 and 211 and three fields in the Lines 204, 207 and 210 as well as a button in line 212. The input field of line 204 contains an identifier 'Amount' and as event control when changing the field the function call 'opener.checkField (this.name, this.value);'.

Gleiches gilt für das zweite Feld, das sich hier im Bei spiel nur durch den Feldnamen 'Account' anstelle von 'Amount' unterscheidet. Die Bezeichner 'this.name' und 'this.value' sind, gemäß der JavaScript-Definition, Bezüge auf den jeweiligen Feldnamen und den jeweiligen Feldinhalt. Die 'onChange'-Angaben sind also für beide Felder iden tisch. Der Präfix 'opener.' in den Angaben für die Ereig nisbehandlung zeigt an, daß die Funktion 'chkField()' in der Steuerseite zu finden ist.The same applies to the second field, which is here in the case just play by the field name 'Account' instead of 'Amount' makes a difference. The identifiers 'this.name' and 'this.value' are references according to the JavaScript definition on the respective field name and the respective field content. The 'onChange' information is therefore identical for both fields table. The prefix 'opener.' in the information for the Ereig Treatment indicates that the 'chkField ()' function in the tax side can be found.

Das dritte Feld in Zeile 210 ist im Beispiel als Nachrich tenfeld konzipiert, in das aus der Steuerseite heraus Mel dungen geschrieben werden. Diese Programmtechnik ist zur Zeit nur mit dem Internet Explorer der Fa. Microsoft, ins besondere der Version 5.5, funktionsfähig. Für den Netscape Navigator kann die vordefinierte Funktion 'alert' verwendet werden oder die Nachricht der Variablen 'defaultStatus' zu gewiesen werden.The third field in line 210 is in the example as a message tenfeld designed, in which Mel be written. This program technology is for Time only with the Internet Explorer from Microsoft, ins special version 5.5, functional. For the Netscape Navigator can use the predefined 'alert' function or the message to the variable 'defaultStatus' be directed.

Die Anzeigeseite wird durch die Angabe 'fullscreen=yes' in Zeile 110 (Fig. 1) formatfüllend angezeigt, so daß die Steuerseite nicht sichtbar ist. Alternativ ist die Benut zung von Frames, die hier nicht dargestellt wird. Die An zeigeseite wird in dem Beispiel von der gleichen Quelle ge laden wie die Steuerseite. Durch Angabe einer absoluten URL in Zeile 110 (Fig. 1) wird erreicht, daß die Anzeigeseite anderswoher geladen wird. Dies ist insbesondere dann sinn voll, wenn die Steuerseite lokal, d. h. von dem den Browser ausführenden, Rechner geladen wird, aber die Anzeigeseite über ein Netzwerk bereitgestellt wird. Da die Erfindung es gerade ermöglicht, die Anzeigeseite weitgehend von der Steuerseite und der Feldüberprüfung zu entkoppeln, können so Änderungen im Layout einfach auf dem Server bereitge stellt werden, ohne daß die Zuverlässigkeit leidet.The display page is displayed in line 110 ( FIG. 1) by the specification 'fullscreen = yes' so that the control page is not visible. An alternative is the use of frames, which is not shown here. In the example, the display page is loaded from the same source as the control side. By specifying an absolute URL in line 110 ( FIG. 1) it is achieved that the display page is loaded elsewhere. This is particularly useful if the control page is loaded locally, ie from the computer executing the browser, but the display page is provided over a network. Since the invention makes it possible to largely decouple the display side from the control side and the field check, changes in the layout can be made available on the server in a simple manner without the reliability suffering.

Wird eines der beiden Felder 'Amount' bzw. 'Account' in der Anzeigeseite gemäß Fig. 2 geändert, so wird die Funktion 'chkField()' in der Steuerseite aufgerufen, die in Zeile 105 bis 107 (Fig. 1) definiert ist. Diese ruft nunmehr in Zeile 106 die Funktion 'chkcode' des bei Start geladenen JAVA-Applets auf, wobei die beiden Parameter für Feldname und Feldinhalt weitergereicht werden. Das Ergebnis dieser Funktion ist im Beispiel der Text 'OK' oder eine Fehlermel dung. Dieser Text wird einerseits in der in Zeile 104 defi nierten Variablen 'res' abgelegt und andererseits in Zeile 107 in die Anzeigeseite übertragen. Alternativ kann durch die vom Browser bereitsgestellte Standardfunktion 'alert()' eine Anzeige erfolgen, wenn das Resultat nicht 'OK' ist. If one of the two fields 'Amount' or 'Account' is changed in the display page according to FIG. 2, the function 'chkField ()' is called in the control page, which is defined in lines 105 to 107 ( FIG. 1). This now calls the function 'chkcode' of the JAVA applet loaded at start in line 106, whereby the two parameters for field name and field content are passed on. In the example, the result of this function is the text 'OK' or an error message. This text is stored on the one hand in the variable 'res' defined in line 104 and on the other hand transferred in line 107 to the display page. Alternatively, the standard function 'alert ()' already provided by the browser can be used to display if the result is not 'OK'.

Aktiviert der Benutzer die in Zeile 212 (Fig. 2) definierte Schaltfläche, so wird die Funktion 'done()' aufgerufen, die in Zeile 112 bis 113 (Fig. 1) definiert ist. In diesem Bei spiel wird lediglich die Variable 'res' abgefragt, ob ein Fehlercode der letzten Feldüberprüfung vorliegt. Ist das nicht der Fall, wird das Anzeigefenster geschlossen. In realistischen Anwendungen werden andere Inhalte geladen, die dann weiterhin sich der Funktionen der Steuerseite ins besondere zur Feldprüfung bedienen können.If the user activates the button defined in line 212 ( FIG. 2), the function 'done ()' is called, which is defined in line 112 to 113 ( FIG. 1). In this example, only the variable 'res' is queried whether there is an error code from the last field check. If this is not the case, the display window is closed. In realistic applications, other content is loaded, which can then continue to use the functions of the control side, in particular for field testing.

In Fig. 3 ist eine einfache Version eines JAVA-Applets ge zeigt, das insbesondere die in Zeile 106 (Fig. 1) aufgeru fene Funktion chkField in Zeile 303 definiert. Als Beispiel wird abhängig von dem Feldnamen eine Überprüfung der Zah lenbereiche durch eine gemeinsame Funktion 'chkRange' vor genommen, die in den Zeilen 310 bis 320 definiert ist und dem mit JAVA vertrauten Programmierer unmittelbar verständ lich sein sollte. Diese Funktion gibt entweder 'OK' bei Werten innerhalb des angegebenen Bereichs oder sonst eine Fehlermeldung zurück. FIG. 3 shows a simple version of a JAVA applet, which in particular defines the chkField function called in line 106 ( FIG. 1) in line 303. As an example, depending on the field name, the number ranges are checked by a common function 'chkRange', which is defined in lines 310 to 320 and should be immediately understandable to programmers familiar with JAVA. This function either returns 'OK' for values within the specified range or otherwise an error message.

Selbstverständlich könnte diese einfache Funktionalität, möglicherweise sogar bequemer, auch direkt in JavaScript in der Steuerseite nach Fig. 1 programmiert werden. Die ge zeigte indirekte Methode über die Kopplung von JavaScript mit JAVA erlaubt jedoch eine Reihe von vorteilhaften Maß nahmen.Of course, this simple functionality, possibly even more convenient, could also be programmed directly in JavaScript in the control page according to FIG. 1. However, the indirect method shown via the coupling of JavaScript with JAVA allows a number of advantageous measures.

Zum einen kann, wie durch Angabe einer absoluten URL mit 'localhost' als Rechneradresse in Zeile 117 (Fig. 1) ge zeigt, das JAVA-Applet von dem jeweiligen Rechner geladen werden, auf dem der Browser ausgeführt wird. Im Falle eines Selbstbedinungsterminals bedeutet dies, daß die Steuerseite über ein Netzwerk von einem zentralen Server bestimmt wird, die Prüfroutinen jedoch letztlich lokal bestimmt sind. Da für JAVA über das 'java native interface' (JNI) eine Ein bindung von Unterprogrammen in anderen Programmiersprachen möglich ist, können so auch in JAVA nicht direkt unter stützte Geräte, hier insbesondere Kartenleser für Magnet streifen- oder Chipkarten, angesprochen werden.On the one hand, as indicated by specifying an absolute URL with 'localhost' as the computer address in line 117 ( Fig. 1), the JAVA applet can be loaded from the respective computer on which the browser is running. In the case of a self-service terminal, this means that the control side is determined by a central server via a network, but the test routines are ultimately determined locally. Since it is possible for JAVA to integrate subroutines in other programming languages via the 'java native interface' (JNI), JAVA cannot directly address supported devices, especially card readers for magnetic stripe or chip cards.

Da zum anderen JAVA bereits über eine vollständige Schnitt stelle für den Aufruf von IP-Protokollen wie TCP/IP ver fügt, kann die Überprüfung der Feldinhalte, z. B. einer Bankleitzahl, durch eine Netzwerkverbindung erfolgen.On the other hand, JAVA already has a complete cut set for calling IP protocols such as TCP / IP adds, the review of the field contents, e.g. B. one Bank routing number, done through a network connection.

Weiterhin bietet JAVA die Möglichkeit, Unterprogramme dyna misch zu laden. Diese werden als 'class' bezeichnet und durch die Methode 'newInstance()' aktiviert. In einer tat sächlichen Implementation werden dann dynamische Assozia tivlisten aufgebaut und die Zeilen 304 bis 307 (Fig. 3) durch eine Suche in solchen Listen ersetzt. Die Listen wer den bevorzugt durch Konfigurationsdateien bestimmt, die den Feldnamen die Bezeichner von Klassen-Methoden zuordnen und mit der Aktivierung des JAVA-Programms aufgebaut werden. Die ensprechende Programmiertechnik darf als dem Fachmann bekannt vorausgesetzt werden und wird daher nicht gezeigt.JAVA also offers the option of dynamically loading subroutines. These are called 'class' and activated by the 'newInstance ()' method. In an actual implementation, dynamic associative lists are then built up and lines 304 to 307 ( FIG. 3) are replaced by a search in such lists. The lists are preferably determined by configuration files, which assign the names of class methods to the field names and are built up when the JAVA program is activated. The corresponding programming technology may be assumed to be known to the person skilled in the art and is therefore not shown.

Claims

1. Method for checking user input when displaying pages formatted by a marking language with active components, with the features:

a control side activates a display side which visually dominates the control side,
the control side loads at least one program module, of which at least one subroutine can be activated via the active components of the marking language,
- At least one input field is provided on the display page, the field content of which is transferred to the program module loaded by the control side via an event handling routine.

2. The method of claim 1, wherein the subroutine Checking the field contents, the result returns the review and thereby further ver keep the user determined.

3. Method according to one of the preceding claims, wherein the program module according to a configuration file Subroutine determined at runtime and dynamic recharges.

4. Method according to one of the preceding claims, wherein the subroutine the field check using a da connection.

5. Method according to one of the preceding claims, wherein the control side and the program module of different Sources are loaded.

6. The method according to any one of the preceding claims, wherein the control side and the display side of different Sources are loaded.

7. The method according to any one of the preceding claims, wherein the same subroutine with identical syntax for multiple fields is used.

8. The method according to any one of claims 1 to 6, wherein the An display page is loaded as full screen display.

9. Device, in particular in a self-service terminal, for checking user input when displaying pages formatted by a marking language with active components, with the features:

a control embedded in a control side activates by means of a display unit a display side which visually dominates the control side,
the controller loads at least one program module, of which at least one subroutine can be activated via the active components of the marking language,
- At least one input field is provided in the display page, the field content of which activates the control via an event handling routine and transfers it to the program module loaded from the control side.

10. Software to carry out one of the methods according to a of the preceding claims.