[ABAP] Konvertierung HTML-String nach HTML-itab

* Konvertierungsklasse HTML-String nach HTML-itab
CLASS lcl_html_str_to_itab DEFINITION FINAL.
  PUBLIC SECTION.

* Zeilenlänge für HTML-itab
    CONSTANTS: co_html_length TYPE i VALUE 1024.
* HTML-itab
    TYPES: ty_html_line TYPE c LENGTH co_html_length.
    TYPES: ty_it_html TYPE STANDARD TABLE OF ty_html_line WITH DEFAULT KEY.

    CLASS-METHODS:
      convert
        IMPORTING
                  i_html_str        TYPE string
        RETURNING VALUE(rv_it_html) TYPE ty_it_html.

ENDCLASS.

CLASS lcl_html_str_to_itab IMPLEMENTATION.
**********************************************************************
* Konvertiert HTML-String nach HTML-itab
**********************************************************************
* i_html_str -> HTML-String
* rv_it_html <- HTML-itab
**********************************************************************
  METHOD convert.

    DATA(lv_right) = i_html_str.

    WHILE strlen( lv_right ) >= co_html_length.
* linker Teil
      DATA(lv_left) = substring( val = lv_right off = 0 len = co_html_length ).
      APPEND lv_left TO rv_it_html.

* Rest
      lv_right = substring( val = lv_right off = co_html_length len = strlen( lv_right ) - co_html_length ).
    ENDWHILE.

* Rest anfügen
    IF strlen( lv_right ) > 0.
      APPEND lv_right TO rv_it_html.
    ENDIF.

  ENDMETHOD.

ENDCLASS.

START-OF-SELECTION.
* Daten holen
  SELECT * FROM tnapr INTO TABLE @DATA(it_tnapr).

* HTML-Daten aus itab generieren
  DATA(lv_html) = cl_demo_output=>get( it_tnapr ).

* HTML-String nach HTML itab konvertieren
  DATA(it_html) = lcl_html_str_to_itab=>convert( lv_html  ).

* HTML-Viewer
  DATA(o_hv) = NEW cl_gui_html_viewer( parent = cl_gui_container=>default_screen ).
* URL holen
  DATA: lv_url type char1024.

  o_hv->load_data( IMPORTING
                     assigned_url = lv_url
                   CHANGING
                     data_table   = it_html ).

* Daten anzeigen
  o_hv->show_url( url = CONV char1024( lv_url )
                  in_place = abap_true ). " im SAP-Fenster (abap_true) oder im Externen Browser (abap_false) anzeigen

* cl_gui_container=>default_screen erzwingen
  WRITE: space.

[ABAP] HTML-Email versenden

DATA: lv_recipient TYPE adr6-smtp_addr.
DATA: lv_subject TYPE string.

lv_recipient = 'email@email.com'.
lv_subject = 'Testemail'.

DATA(lv_html_text) = VALUE string( ).

lv_html_text = |<BODY> | &&
               |<P><B>Test</B></BR>| &&
               |</BODY>|.

DATA(it_body_txt) = cl_document_bcs=>string_to_soli( ip_string = lv_html_text ).

TRY.
* it_body_txt beinhaltet die Zeilen des Body-Textes
* die Zeilen sind jeweils char255 Zeichen lang
* eine Zeile (line) ist vom Typ SOLI

* Document (Mail) erzeugen
* Email-Subject (i_subject) darf hier max. 50 Zeichen lang sein (Subject-Darstellung in der SOST)
* die "richtige" Übergabe des Email-Subjects erfolgt weiter unten in der Funktion set_message_subject( )
    DATA(o_document) = cl_document_bcs=>create_document( i_type    = 'HTM'
                                                         i_text    = it_body_txt
                                                         i_subject = CONV so_obj_des( lv_subject ) ).

* Sendrequest erzeugen
    DATA(o_send_request) = cl_bcs=>create_persistent( ).
* Email-Subject festlegen, ip_subject ist vom Typ String
    o_send_request->set_message_subject( ip_subject = lv_subject ).
* Die Mail an den Sendrequest hängen
    o_send_request->set_document( o_document ).

* SAP-User als Sender
    DATA(o_sender) = cl_sapuser_bcs=>create( sy-uname ).
* Email-Adresse als Sender
*        DATA(o_sender) = cl_cam_address_bcs=>create_internet_address( i_address_string = 'email@email.com' ).
    o_send_request->set_sender( o_sender ).

* Empfänger -> beachte: u.U. sind Email-Adressen mit Umlauten nicht zulässig -> Exception
    DATA(o_recipient) = cl_cam_address_bcs=>create_internet_address( lv_recipient ).
    o_send_request->add_recipient( i_recipient = o_recipient
                                   i_express = abap_true
                                 " i_copy      = abap_true " CC
                                 " i_blind_copy = abap_true " BCC
                                 ).

* Sofort senden
    o_send_request->set_send_immediately( abap_true ).

* Dokument senden
    IF o_send_request->send( i_with_error_screen = abap_true ) = abap_true.
      WRITE: / 'Email gesendet.'.
    ELSE.
      WRITE: / 'Fehler beim Email-Versand.'.
    ENDIF.

* Persistenzdienste des Objektes starten, sonst wird ggf. die Mail nicht gesendet
    COMMIT WORK.

  CATCH cx_root INTO DATA(e_text).
    WRITE: / e_text->get_text( ).
ENDTRY.

[ABAP] HTML-Code aus interner Tabelle generieren

CLASS lcl_itab_to_html DEFINITION FINAL.
  PUBLIC SECTION.
    TYPES: BEGIN OF ty_fields,
             field TYPE fieldname,
             width TYPE char20,
             text  TYPE char80,
           END OF ty_fields.

    TYPES: ty_it_fields TYPE STANDARD TABLE OF ty_fields WITH DEFAULT KEY.

    TYPES: ty_it_html TYPE STANDARD TABLE OF char1024 WITH DEFAULT KEY.

    CLASS-METHODS:
      convert_itab_to_html_table
        IMPORTING
                  i_fields       TYPE ty_it_fields
                  i_itab         TYPE STANDARD TABLE
        RETURNING VALUE(rv_html) TYPE ty_it_html.

ENDCLASS.

CLASS lcl_itab_to_html IMPLEMENTATION.
  METHOD convert_itab_to_html_table.

    APPEND '<table style="width: 100%; background: #ffffff; word-wrap: break-word; table-layout: fixed; font-family: Courier; font-size: 12px;">' TO rv_html.
    APPEND '  <thead>' TO rv_html.
    APPEND '    <tr>' TO rv_html.

    LOOP AT i_fields ASSIGNING FIELD-SYMBOL(<field>).
      IF <field>-width IS INITIAL.
        APPEND |      <th style="background: #eeeeee;"> { <field>-text }</th>| TO rv_html.
      ELSE.
        APPEND |      <th style="background: #eeeeee; width: { <field>-width };"> { <field>-text }</th>| TO rv_html.
      ENDIF.
    ENDLOOP.

    APPEND '    </tr>' TO rv_html.
    APPEND '  </thead>' TO rv_html.
    APPEND '  <tbody>' TO rv_html.

    FIELD-SYMBOLS: <value> TYPE any.

    LOOP AT i_itab ASSIGNING FIELD-SYMBOL(<data_line>).

      APPEND '    <tr>' TO rv_html.

      LOOP AT i_fields ASSIGNING FIELD-SYMBOL(<field_b>).
        ASSIGN COMPONENT <field_b>-field OF STRUCTURE <data_line> TO <value>.
        IF <value> IS ASSIGNED.
          APPEND |      <td>{ <value> }</td>| TO rv_html.
        ENDIF.
      ENDLOOP.

      APPEND '    </tr>' TO rv_html.
    ENDLOOP.

    APPEND '  </tbody>' TO rv_html.
    APPEND '</table>' TO rv_html.

  ENDMETHOD.

ENDCLASS.

START-OF-SELECTION.
* HTML-Viewer
  DATA(o_html) = NEW cl_gui_html_viewer( parent = cl_gui_docking_container=>default_screen ).

  DATA: it_mara TYPE STANDARD TABLE OF marav WITH DEFAULT KEY.

  SELECT * FROM marav INTO TABLE @it_mara.

  IF sy-subrc = 0.
* Felder für die Anzeige konfigurieren
    DATA(it_fields)	= VALUE lcl_itab_to_html=>ty_it_fields( ( text  = 'Materialnummer'
                                                              field = 'MATNR'
                                                              width = '20%' )

                                                            ( text  = 'Kurztext'
                                                              field = 'MAKTX'
                                                              width = '20%' )

                                                            ( text  = 'Materialart'
                                                              field = 'MTART'
                                                              width = '20%' )

                                                            ( text  = 'Materialklasse'
                                                              field = 'MATKL'
                                                              width = '20%' )

                                                            ( text  = 'Mengeneinheit'
                                                              field = 'MEINS'
                                                              width = '10%' )

                                                            ( text  = 'Löschkennzeichen'
                                                              field = 'LVORM'
                                                              width = '10%' ) ).


* HTML aus den Quelldaten erzeugen
    DATA(it_html) = lcl_itab_to_html=>convert_itab_to_html_table( i_fields = it_fields
                                                                  i_itab   = it_mara ).

* URL zu HTML holen
    DATA: lv_url TYPE char1024.

    o_html->load_data( IMPORTING
                         assigned_url = lv_url
                       CHANGING
                         data_table   = it_html ).

* HTML anzeigen
    o_html->show_url( url = lv_url ).

* leere SAP-Toolbar ausblenden
    cl_abap_list_layout=>suppress_toolbar( ).

* cl_gui_docking_container=>default_screen erzwingen
    WRITE: space.

  ENDIF.

[ABAP] Externe Webseite (HTML) anzeigen

TYPES: ty_it_events TYPE STANDARD TABLE OF cntl_simple_event WITH DEFAULT KEY.

PARAMETERS: p_url TYPE string LOWER CASE DEFAULT 'http://www.google.de'.

CLASS lcl_events DEFINITION.
  PUBLIC SECTION.

    CLASS-METHODS:
      on_navigate_complete FOR EVENT navigate_complete OF cl_gui_html_viewer
        IMPORTING
            url
            sender.

    CLASS-METHODS:
      on_sapevent FOR EVENT sapevent OF cl_gui_html_viewer
        IMPORTING
            action
            frame
            getdata
            postdata
            query_table
            sender.
ENDCLASS.

CLASS lcl_events IMPLEMENTATION.

* nach Aufbau des Dokuments
  METHOD on_navigate_complete.
    MESSAGE |Loaded: { url }| TYPE 'S'.
  ENDMETHOD.

* Link- oder Button-Klick
  METHOD on_sapevent.
    MESSAGE |Action: { action }, get: { getdata }| TYPE 'S'.
  ENDMETHOD.
ENDCLASS.

INITIALIZATION.

  DATA(o_dock) = NEW cl_gui_docking_container( ratio = 80
                                               side = cl_gui_docking_container=>dock_at_bottom
                                               no_autodef_progid_dynnr = 'X' ).

* HTML-Viewer
  DATA(o_html) = NEW cl_gui_html_viewer( parent = o_dock ).

* Eventtypten müssen gesondert registriert werden
  DATA(it_events) = VALUE ty_it_events( ( eventid = cl_gui_html_viewer=>m_id_navigate_complete
                                          appl_event = abap_true )
                                        ( eventid = cl_gui_html_viewer=>m_id_sapevent
                                          appl_event = abap_true ) ).

  o_html->set_registered_events( events = it_events ).

* Eventhandler registrieren
  SET HANDLER lcl_events=>on_navigate_complete FOR o_html.
  SET HANDLER lcl_events=>on_sapevent FOR o_html.

* HTML anzeigen
  o_html->show_url( url = |{ p_url }| ).

[ABAP] Selektionsbild mit HTML-Elementen, Dateneingabe, SALV-Grid, CSS, Eventhandling

**********************************************************************
*
* Datentypen, Variablen, Konstanten
*
**********************************************************************
TYPES: ty_it_events TYPE STANDARD TABLE OF cntl_simple_event WITH DEFAULT KEY.
TYPES: ty_it_html TYPE STANDARD TABLE OF char1024 WITH DEFAULT KEY.

CONSTANTS: co_carrid TYPE string VALUE 'carrid'.
CONSTANTS: co_airpto TYPE string VALUE 'airpto'.

DATA: o_splitter_main TYPE REF TO cl_gui_splitter_container.
DATA: o_container_l   TYPE REF TO cl_gui_container.
DATA: o_container_r   TYPE REF TO cl_gui_container.
DATA: o_html TYPE REF TO cl_gui_html_viewer.
DATA: o_salv TYPE REF TO cl_salv_table.

DATA: it_spfli TYPE STANDARD TABLE OF spfli.
DATA: it_salv_spfli TYPE STANDARD TABLE OF spfli.
DATA: it_sairport TYPE STANDARD TABLE OF sairport.

DATA: it_html TYPE ty_it_html.
**********************************************************************
*
* Eventhandler
*
**********************************************************************
CLASS lcl_html_events DEFINITION.
  PUBLIC SECTION.
    CLASS-METHODS:
      on_sapevent FOR EVENT sapevent OF cl_gui_html_viewer
        IMPORTING
            action
            frame
            getdata
            postdata
            query_table
            sender.
ENDCLASS.

CLASS lcl_html_events IMPLEMENTATION.
* Link- oder Button-Klick
  METHOD on_sapevent.
    IF o_salv IS BOUND.
      TRY.
* Element in der Nodes-Tabelle lesen
          ASSIGN query_table[ name = co_carrid ] TO FIELD-SYMBOL(<fs_carrid>).
          ASSIGN query_table[ name = co_airpto ] TO FIELD-SYMBOL(<fs_airpto>).

* iTab für SALV-Table neu aufbauen, abhängig von der Eingabe in den Formularfeldern
          it_salv_spfli = VALUE #( FOR l IN it_spfli WHERE ( ( carrid = <fs_carrid>-value ) OR ( airpto = <fs_airpto>-value ) )
                                   ( mandt = l-mandt
                                     carrid = l-carrid
                                     connid = l-connid
                                     countryfr = l-countryfr
                                     cityfrom = l-cityfrom
                                     airpfrom = l-airpfrom
                                     countryto = l-countryto
                                     cityto = l-cityto
                                     airpto = l-airpto
                                     fltime = l-fltime
                                     deptime = l-deptime
                                     arrtime = l-arrtime
                                     distance = l-distance
                                     distid = l-distid
                                     fltype = l-fltype
                                     period = l-period ) ).

* SALV-Table neu anzeigen
          o_salv->refresh( ).
        CATCH cx_root INTO DATA(e_txt).
          MESSAGE e_txt->get_text( ) TYPE 'S'.
      ENDTRY.
    ENDIF.
  ENDMETHOD.
ENDCLASS.
**********************************************************************
*
* SELECTION-SCREEN
*
**********************************************************************
* leeres Selektionsbild als Dummy für die Container-Objekte (o_splitter_main ...)
SELECTION-SCREEN BEGIN OF SCREEN 2000.
SELECTION-SCREEN END OF SCREEN 2000.
**********************************************************************
*
* INITIALIZATION
*
**********************************************************************
INITIALIZATION.
* Daten holen
  SELECT * INTO TABLE it_spfli FROM spfli.
  SELECT * INTO TABLE it_sairport FROM sairport.

* HTML-Code mit Buttons und Forms
  APPEND |<html>| TO it_html.
  APPEND |  <head>| TO it_html.
  APPEND |    <meta http-equiv="content-type" content="text/html; charset=utf-8">| TO it_html.
  APPEND |    <script type="text/javascript">| TO it_html.
  APPEND |      function onKeyDown(f)| TO it_html.
  APPEND |      \{ if(event.keyCode == 13)| TO it_html.
  APPEND |         \{ document[f.name].submit();| TO it_html.
  APPEND |         \}| TO it_html.
  APPEND |      \}| TO it_html.
  APPEND |    </script>| TO it_html.
  APPEND |    <style type="text/css">| TO it_html.
  APPEND |       body \{| TO it_html.
  APPEND |         font-family: Courier New;| TO it_html.
  APPEND |         font-size: 13px;| TO it_html.
  APPEND |         font-style: normal;| TO it_html.
  APPEND |         font-variant: normal;| TO it_html.
  APPEND |         font-weight: 400;| TO it_html.
  APPEND |         line-height: 13px;| TO it_html.
  APPEND |       \}| TO it_html.
  APPEND |       form \{| TO it_html.
  APPEND |         background: lightblue;| TO it_html.
  APPEND |       \}| TO it_html.
  APPEND |       label \{| TO it_html.
  APPEND |         text-align: right;| TO it_html.
  APPEND |         line-height: 1.5;| TO it_html.
  APPEND |         float: left;| TO it_html.
  APPEND |         width: 40%;| TO it_html.
  APPEND |       \}| TO it_html.
  APPEND |       input \{| TO it_html.
  APPEND |         margin: 0 0 1em .2em;| TO it_html.
  APPEND |         padding: .2em .5em;| TO it_html.
  APPEND |         background-color: #fffbf0;| TO it_html.
  APPEND |         border: 1px solid #e7c157;| TO it_html.
  APPEND |         float: left;| TO it_html.
  APPEND |         width: 40%;| TO it_html.
  APPEND |         font-family: Courier New;| TO it_html.
  APPEND |         font-size: 13px;| TO it_html.
  APPEND |         font-style: normal;| TO it_html.
  APPEND |         font-variant: normal;| TO it_html.
  APPEND |         font-weight: 400;| TO it_html.
  APPEND |         line-height: 13px;| TO it_html.
  APPEND |       \}| TO it_html.
  APPEND |       select \{| TO it_html.
  APPEND |         margin: 0 0 1em .2em;| TO it_html.
  APPEND |         padding: .2em .5em;| TO it_html.
  APPEND |         background-color: #fffbf0;| TO it_html.
  APPEND |         border: 1px solid #e7c157;| TO it_html.
  APPEND |         float: left;| TO it_html.
  APPEND |         width: 40%;| TO it_html.
  APPEND |         font-family: Courier New;| TO it_html.
  APPEND |         font-size: 13px;| TO it_html.
  APPEND |         font-style: normal;| TO it_html.
  APPEND |         font-variant: normal;| TO it_html.
  APPEND |         font-weight: 400;| TO it_html.
  APPEND |         line-height: 13px;| TO it_html.
  APPEND |       \}| TO it_html.
  APPEND |       button \{| TO it_html.
  APPEND |         margin-top: 1.5em;| TO it_html.
  APPEND |         float: right;| TO it_html.
  APPEND |       \}| TO it_html.
  APPEND |      </style>| TO it_html.
  APPEND |  </head>| TO it_html.
  APPEND |  <body>| TO it_html.
  APPEND |    <form name="INPUT" accept-charset="utf-8" method="post" action="SAPEVENT:INPUT_FIELDS">| TO it_html.
  APPEND |      <br>| TO it_html.
  APPEND |      <label for="{ co_carrid }">Fluggesellschaft:</label>| TO it_html.
  APPEND |      <input type="text" name="{ co_carrid }" value="LH" onKeyDown="onKeyDown(this.form);">| TO it_html.
  APPEND |      <br>| TO it_html.
  APPEND |      <label for="{ co_airpto }">Zielflughafen:</label>| TO it_html.
  APPEND |      <select name="{ co_airpto }">| TO it_html.

  LOOP AT it_sairport ASSIGNING FIELD-SYMBOL(<fs_airport>).
    APPEND |        <option>{ <fs_airport>-id }</option>| TO it_html.
  ENDLOOP.

  APPEND |      </select>| TO it_html.
  APPEND |      <br>| TO it_html.
  APPEND |      <button type="submit" title="Anzeigen">Anzeigen</button>| TO it_html.
  APPEND |      <br>| TO it_html.
  APPEND |      <br>| TO it_html.
  APPEND |      <br>| TO it_html.
  APPEND |      <br>| TO it_html.
  APPEND |    </form>| TO it_html.
  APPEND |  </body>| TO it_html.
  APPEND |</html>| TO it_html.

**********************************************************************
*
* AT SELECTION-SCREEN OUTPUT
*
**********************************************************************
AT SELECTION-SCREEN OUTPUT.
* Doppelte Objekterzeugung unterbinden
  IF NOT o_splitter_main IS BOUND.
* Splitter auf default_screen (SELECTION-SCREEN 2000) erzeugen
    o_splitter_main = NEW #( parent  = cl_gui_container=>default_screen
                             rows    = 1
                             columns = 2 ).

* Breite in % (linke Spalte für den Tree)
    o_splitter_main->set_column_width( id = 1 width = 20 ).

* linken und rechten Splitcontainer holen
    o_container_l = o_splitter_main->get_container( row = 1 column = 1 ).
    o_container_r = o_splitter_main->get_container( row = 1 column = 2 ).

* HTML-Viewer
    o_html = NEW cl_gui_html_viewer( parent = o_container_l ).

* Eventtypten müssen gesondert registriert werden
    DATA(it_events) = VALUE ty_it_events( ( eventid = cl_gui_html_viewer=>m_id_sapevent
                                            appl_event = abap_true ) ).

    o_html->set_registered_events( events = it_events ).

* Eventhandler registrieren
    SET HANDLER lcl_html_events=>on_sapevent FOR o_html.

* URL zu HTML holen
    DATA: lv_url TYPE char1024.

    o_html->load_data( IMPORTING
                         assigned_url = lv_url
                       CHANGING
                         data_table   = it_html ).

* HTML anzeigen
    o_html->show_url( url = lv_url ).

    it_salv_spfli = it_spfli.

* SALV-Table für Anzeige der Daten
    cl_salv_table=>factory( EXPORTING
                              r_container    = o_container_r
                            IMPORTING
                              r_salv_table   = o_salv
                            CHANGING
                              t_table        = it_salv_spfli ).

    o_salv->get_display_settings( )->set_striped_pattern( abap_true ).
    o_salv->get_columns( )->set_optimize( abap_true ).
    o_salv->get_functions( )->set_all( ).
    o_salv->get_selections( )->set_selection_mode( if_salv_c_selection_mode=>row_column ).
    o_salv->display( ).
  ENDIF.
**********************************************************************
*
* AT SELECTION-SCREEN
*
**********************************************************************
AT SELECTION-SCREEN.
* wenn "Ausführen" (F8) geklickt wurde
  IF sy-ucomm = 'CRET'.
* Selektionbild 2000 wieder anzeigen
    CALL SELECTION-SCREEN 2000.
  ENDIF.
**********************************************************************
*
* START-OF-SELECTION
*
**********************************************************************
START-OF-SELECTION.
* leeres Selektionbild 2000 anzeigen
  CALL SELECTION-SCREEN 2000.

[ABAP] HTML-basierte Anzeige: Ausklappbarer Dockingcontainer im Selektionsbild, Eventhandling

TYPES: ty_it_events TYPE STANDARD TABLE OF cntl_simple_event WITH DEFAULT KEY.
TYPES: ty_it_html TYPE STANDARD TABLE OF char1024 WITH DEFAULT KEY.

CONSTANTS c_dock_open TYPE i VALUE 400.
CONSTANTS c_dock_close TYPE i VALUE 150.
CONSTANTS c_cmd_open TYPE string VALUE 'OPEN'.
CONSTANTS c_cmd_close TYPE string VALUE 'CLOSE'.
CONSTANTS c_cmd_click TYPE string VALUE 'CLICK'.

DATA: o_docker TYPE REF TO cl_gui_docking_container.

PARAMETERS: p_field TYPE char10 DEFAULT '####'.

CLASS lcl_events DEFINITION.
  PUBLIC SECTION.

    CLASS-METHODS:
      on_sapevent FOR EVENT sapevent OF cl_gui_html_viewer
        IMPORTING
            action
            frame
            getdata
            postdata
            query_table.
ENDCLASS.

CLASS lcl_events IMPLEMENTATION.
  METHOD on_sapevent.

    IF o_docker IS BOUND.
      CASE action.
* Container ausklappen
        WHEN c_cmd_open.
          o_docker->set_extension( EXPORTING
                                     extension = c_dock_open ).
* Container einklappen
        WHEN c_cmd_close.
          o_docker->set_extension( EXPORTING
                                     extension = c_dock_close ).
      ENDCASE.
    ENDIF.

* Action im Parameterfeld ausgeben
    p_field = action.

  ENDMETHOD.

ENDCLASS.

INITIALIZATION.
* Docking-Container für HTML-Viewer-Element
  o_docker = NEW #( extension               = c_dock_close
                    side                    = cl_gui_docking_container=>dock_at_right
                    no_autodef_progid_dynnr = abap_true ).

* HTML-Viewer
  DATA(o_html) = NEW cl_gui_html_viewer( parent = o_docker ).

* SAP-Events registrieren
  DATA(it_events) = VALUE ty_it_events( ( eventid = cl_gui_html_viewer=>m_id_sapevent
                                          appl_event = abap_true ) ).

  o_html->set_registered_events( events = it_events ).

  SET HANDLER lcl_events=>on_sapevent FOR o_html.

* HTML-Code
  DATA(it_html) = VALUE ty_it_html( ( |<html>| )
                                    ( |  <meta http-equiv="content-type" content="text/html" charset="ISO-8859-1">| )
                                    ( |  <head>| )
                                    ( |  <title>Test</title>| )
                                    ( |  <script type="text/javascript">| )
                                    ( |    function open_close(element)| )
                                    ( |    \{| )
                                    ( |      location.href = "SAPEVENT:" + element;| )
                                    ( |    \}| )
                                    ( |    function mouse_click(element)| )
                                    ( |    \{| )
                                    ( |      location.href = "SAPEVENT:" + element;| )
                                    ( |    \}| )
                                    ( |  </script>| )
                                    ( |  </head>| )
                                    ( |  <body style="overflow:auto">| )
                                    ( |    <table border="0" width="300px">| )
                                    ( |      <tr>| )
                                    ( |        <td><button onmouseover="open_close('{ c_cmd_open }')">Show</button></td>| )
                                    ( |      </tr>| )
                                    ( |      <tr>| )
                                    ( |        <td>--------------------<a href="#" onclick="mouse_click('{ c_cmd_click }')">Klick</a></td>| )
                                    ( |      </tr>| )
                                    ( |      <tr>| )
                                    ( |        <td><button onmouseover="open_close('{ c_cmd_close }')">Hide</button></td>| )
                                    ( |      </tr>| )
                                    ( |    </table>| )
                                    ( |  </body>| )
                                    ( |</html>| ) ).

* HTML anzeigen
  DATA: lv_url TYPE char1024.

  o_html->load_data( IMPORTING
                       assigned_url = lv_url
                     CHANGING
                       data_table   = it_html ).

  o_html->show_url( url = lv_url ).

Links

[ABAP] HTML-Code im cl_gui_html_viewer anzeigen, Eventhandling

* Demoprogramme:
* SAPHTML_EVENTS_DEMO
* SAPHTML_SCRIPT_DEMO
* DEMO_TABLE_EXPRESSIONS

TYPES: ty_it_events TYPE STANDARD TABLE OF cntl_simple_event WITH DEFAULT KEY.
TYPES: ty_it_html TYPE STANDARD TABLE OF char1024 WITH DEFAULT KEY.

PARAMETERS: p_url TYPE string.

CLASS lcl_events DEFINITION.
  PUBLIC SECTION.

    CLASS-METHODS:
      on_navigate_complete FOR EVENT navigate_complete OF cl_gui_html_viewer
        IMPORTING
            url
            sender.

    CLASS-METHODS:
      on_sapevent FOR EVENT sapevent OF cl_gui_html_viewer
        IMPORTING
            action
            frame
            getdata
            postdata
            query_table
            sender.
ENDCLASS.

CLASS lcl_events IMPLEMENTATION.

* nach Aufbau des Dokuments
  METHOD on_navigate_complete.
    p_url = url.
  ENDMETHOD.

* Link- oder Button-Klick
  METHOD on_sapevent.
    MESSAGE |Action: { action }, get: { getdata }| TYPE 'S'.
  ENDMETHOD.
ENDCLASS.

INITIALIZATION.

  DATA(o_dock) = NEW cl_gui_docking_container( ratio = 50
                                               side = cl_gui_docking_container=>dock_at_bottom
                                               no_autodef_progid_dynnr = 'X' ).

* HTML-Viewer
  DATA(o_html) = NEW cl_gui_html_viewer( parent = o_dock ).

* Eventtypten müssen gesondert registriert werden
  DATA(it_events) = VALUE ty_it_events( ( eventid = cl_gui_html_viewer=>m_id_navigate_complete
                                          appl_event = abap_true )
                                        ( eventid = cl_gui_html_viewer=>m_id_sapevent
                                          appl_event = abap_true ) ).

  o_html->set_registered_events( events = it_events ).

* Eventhandler registrieren
  SET HANDLER lcl_events=>on_navigate_complete FOR o_html.
  SET HANDLER lcl_events=>on_sapevent FOR o_html.

* HTML-Code mit Buttons und Forms
  DATA(it_html) = VALUE ty_it_html( ( |<html>| )
                                    ( |  <head>| )
                                    ( |    <title>Drag & Drop Test</title>| )
                                    ( |  </head>| )
                                    ( |  <script type="text/javascript">| )
                                    ( |    function mouse_click(element)| )
                                    ( |    \{| )
                                    ( |      location.href = "SAPEVENT:" + element;| )
                                    ( |    \}| )
                                    ( |  </script>| )
                                    ( |  <body bgcolor="#AABBCC">| )
                                    ( |    <p><font size=30>Dateien mit der Maus hierher ziehen!</font></p>| )
                                    ( |    <form method="post" action="SAPEVENT:SHOW_INFO?PARAMETER1">| )
                                    ( |      <p><input type="submit" value="Klick!"></p>| )
                                    ( |    </form>| )
                                    ( |    <form method="post" action="">| )
                                    ( |      <a href="SAPEVENT:LINK_KLICK?PARAMETER2">Link</a>| )
                                    ( |    </form>| )
                                    ( |    <button onclick="mouse_click('BTN_CLICK')">Show</button>| )
                                    ( |  </body>| )
                                    ( |</html>| ) ).

* URL zu HTML holen
  DATA: lv_url TYPE char1024.

  o_html->load_data( IMPORTING
                       assigned_url = lv_url
                     CHANGING
                       data_table   = it_html ).

* HTML anzeigen
  o_html->show_url( url = lv_url ).

[ABAP] HTML-Templates verwenden

* Pflege der HTML-Templates erfolgt in der Transaktion SMW0
DATA: it_merge_table TYPE swww_t_merge_table.
DATA: it_html_table TYPE swww_t_html_table.

* !USERID! im Template mit Benutzernamen ersetzen
DATA(lv_merge_item1) = VALUE swww_t_merge_item( name = '!USERID!' command = 'R' html = VALUE #( ( |{ sy-uname }| ) ) ).
APPEND lv_merge_item1 TO it_merge_table.
* !DATE! im Template mit Systemdatum ersetzen
DATA(lv_merge_item2) = VALUE swww_t_merge_item( name = '!DATE!' command = 'R' html = VALUE #( ( |{ sy-datum }| ) ) ).
APPEND lv_merge_item2 TO it_merge_table.

CALL FUNCTION 'WWW_HTML_MERGER'
  EXPORTING
    template           = 'ZZ_HTML_TEMPLATE_TEST' " Name des Templates
  IMPORTING
    html_table         = it_html_table
  CHANGING
    merge_table        = it_merge_table
  EXCEPTIONS
    template_not_found = 1
    OTHERS             = 2.

IF sy-subrc = 0.
  LOOP AT it_html_table INTO DATA(lv_line).
    WRITE / lv_line-line.
  ENDLOOP.
ENDIF.

[ABAP] Nutzung der Google-Chart-API zur Anzeige von Charts

* Beispiel adaptiert von:
* http://www.tricktresor.de/blog/sap-und-bunte-bilder-cl_gui_html_viewer/

TYPES: BEGIN OF ty_s032,
         werks   TYPE s032-werks,
         wbwbest TYPE s032-wbwbest,
       END OF ty_s032.

DATA: it_data TYPE STANDARD TABLE OF ty_s032.
DATA: lv_page TYPE string.
DATA: lv_html type string.
DATA: lv_s032 TYPE s032.

SELECT-OPTIONS: s_werks FOR lv_s032-werks.

START-OF-SELECTION.

* Alle Bestände je Werk aus der S032 summieren
  SELECT werks SUM( wbwbest ) AS wbwbest FROM s032
    INTO CORRESPONDING FIELDS OF TABLE it_data
    WHERE werks IN s_werks
    AND vrsio = '000'
    GROUP BY werks.

* HTML-Code erzeugen
  lv_page = |<html>|.
  lv_page = |{ lv_page }<head>|.
  lv_page = |{ lv_page }<script type="text/javascript" src="https://www.google.com/jsapi"></script>|.
  lv_page = |{ lv_page }<script type="text/javascript">|.
  lv_page = |{ lv_page }google.load("visualization", "1", \{packages:["corechart"]\});|.
  lv_page = |{ lv_page }google.setOnLoadCallback(drawChart);|.
  lv_page = |{ lv_page }function drawChart() \{|.
  lv_page = |{ lv_page }var data = google.visualization.arrayToDataTable([|.

* Daten aus der iTab in den Code einfügen
  lv_page = |{ lv_page } ['Werk', 'Bestand'],|.

  LOOP AT it_data ASSIGNING FIELD-SYMBOL(<fs_data>).
    IF lv_html IS INITIAL.
      lv_html = | ['{ <fs_data>-werks }', { <fs_data>-wbwbest }]|.
    ELSE.
      lv_html = | , ['{ <fs_data>-werks }', { <fs_data>-wbwbest }]|.
    ENDIF.

    lv_page = |{ lv_page }{ lv_html }|.
  ENDLOOP.

* Code abschließen
  lv_page = |{ lv_page }]);|.
  lv_page = |{ lv_page } var options = \{|.
  lv_page = |{ lv_page } title: 'Diagrammtitel'|.
  lv_page = |{ lv_page } \};|.
  lv_page = |{ lv_page } var chart = new google.visualization.PieChart(document.getElementById('piechart'));|.
  lv_page = |{ lv_page } chart.draw(data, options);|.
  lv_page = |{ lv_page } \}|.
  lv_page = |{ lv_page } </script>|.
  lv_page = |{ lv_page } </head>|.
  lv_page = |{ lv_page } <body>|.
  lv_page = |{ lv_page } <div id="piechart" style="width: 900px; height: 500px;"></div>|.
  lv_page = |{ lv_page } </body>|.
  lv_page = |{ lv_page }</html>|.

* HTML anzeigen
  cl_abap_browser=>show_html( html_string = lv_page
                              title       = 'Chart'
                              size        = cl_abap_browser=>large ).

[ABAP] URL im SAP-Browser als PopUp-Fenster anzeigen

Beispiel 1

cl_abap_browser=>show_url( url          = 'www.google.de'
                           title        = 'ABAP-Browser'
                           size         = cl_abap_browser=>large
                           modal        = abap_true
                           printing     = abap_false
                           buttons      = abap_true
                           format       = cl_abap_browser=>landscape
                           position     = cl_abap_browser=>topleft
                           context_menu = abap_false ).

Beispiel 2

* HTML-Code generieren lassen
SELECT * FROM tnapr INTO TABLE @DATA(it_tnapr).
DATA(lv_html) = cl_demo_output=>get( it_tnapr ).

* HTML-Code anzeigen
cl_abap_browser=>show_html( html_string  = lv_html
                            size         = cl_abap_browser=>xlarge
                            format       = cl_abap_browser=>landscape
                            context_menu = abap_true
                            buttons       = cl_abap_browser=>navigate_html ).