Kommunikation zwischen Web Dynpro und UI-Elementen zur HTML-Integration
Die Kommunikation zwischen Web Dynpro Backend und der Instanz des HTMLIsland bzw. HTMLContainer auf dem Client (Browser) erfolgt über JavaScript-Aufrufe, die Sie über die Schnittstelle IF_WD_HTML_SCRIPT_CALL erstellen können.
Eine Instanz dieser Schnittstelle erzeugen Sie mit der statischen Methode NEW_CALL der Klasse CL_WD_HTML_SCRIPT_CALL.
Mit der Methode ADD_SCRIPT_CALL wird einem Web Dynpro UI-Element vom Typ HTMLIsland oder HTMLContainer ( CL_WD_ABSTRACT_HTML_ELEMENT) eine Referenz auf einen JavaScript-Aufruf hinzugefügt.
Mit der Methode SET_DESTROY_SCRIPT_CALL können Sie an HTMLIsland oder HTMLContainer einen Aufruf setzen, welcher ausgeführt wird, wenn die Instanz der HTMLIsland bzw. des HTMLContainers auf dem Browser abgebaut wird.
JavaScript-Aufrufe vom Backend feuern
In diesem Beispiel soll der Benutzer über einen Button einen JavaScript-Aufruf ans Backend feuern können. Wenn der Benutzer diesen Button drückt, soll ein Popup mit dem Text 'Hello World!' erscheinen.
Dazu muss auf dem Browser ein JavaScript-Objekt myJSVariable existieren, welches die Funktion greet mit einem Stringparameter besitzt.
Legen Sie zunächst eine JavaScript-Datei mit dem folgenden Code an:
var myJSVariable = {
greet: function (message) {
alert(message);
}
};
Diese JavaScript-Datei können Sie über die Aggregation SCRIPTS in eine HTMLIsland oder in einen HTMLContainer einbinden.
Um mit Hilfe der API IF_WD_HTML_SCRIPT_CALL den Aufruf myJSVariable.greet('Hello World') zu formulieren, können Sie in der onAction-Ereignisbehandlermethode des Button folgenden Code verwenden:
method ONACTIONGREET .
wd_this->m_html_island->add_script_call(
cl_wd_html_script_call=>new_call(
)->variable( `myJSVariable`
)->function( `greet`
)->add_string( `Hello World`!` ).
).
endmethod.
Web Dynpro Aktion am Browser auslösen
Fügen Sie Ihrem Web Dynpro UI-Element HTMLIsland oder HTMLContainer die Aggregation EVENTS hinzu, geben Sie bei der Eigenschaft Name z.B. myEvent an und implementieren Sie eine onAction-Ereignisbehandlermethode.
Um dieses Ereignis Client-seitig aufzurufen, muss eine Referenz auf die Callback API als Parameter eines JavaScript-Aufrufs übertragen werden:
wd_this->m_html_island->add_script_call(
cl_wd_html_script_call=>new_call(
)->variable( ` MyHTMLIsland `
)->function( `setCallbackAPI`
)->add_callback_api( )
).
Das Client-seitige JavaScript-Objekt muss eine Funktion setCallbackAPI mit einem Parameter besitzen, der die Referenz auf die Callback API enthält. Um eine Web Dynpro Aktion auszulösen, können Sie in Ihrer JavaScript-Datei die folgende Referenz verwenden:
callback.fireEvent('myEvent','dataString');
Testfälle zur Kommunikation bei HTMLIsland bzw. HTMLContainer finden Sie in der Component WDR_TEST_HTML_ELEMENT.