Application Development Discussions
Join the discussions or start your own on all things application development, including tools and APIs, programming models, and keeping your skills sharp.
cancel
Showing results for 
Search instead for 
Did you mean: 

Catch JavaScript events in CL_GUI_HTML_VIEWER

0 Kudos

Hi together,

I use the CL_GUI_HTML_VIEWER in an application and try to catch the onKeyPress event.

The Template works fine, when it is loaded directly in the IE. When I load it in the

CL_GUI_HTML_VIEWER the event is not raised.

Does anyone have an idea?

Thanks in advance...Thomas

1 ACCEPTED SOLUTION

Former Member
0 Kudos

Hi Thomas

   The class CL_GUI_HTML_VIEWER does not respond html events but only the ON_SAPEVENT event which responds to html SUBMIT or POST events.

So try to do something as following also for more you can see the SAPHTML_EVENTS_DEMO program.

the class handler for SAPEVENT of your html viewer

CLASS CL_MYEVENT_HANDLER DEFINITION.
 
PUBLIC SECTION.
   
METHODS: ON_SAPEVENT
              
FOR EVENT SAPEVENT OF CL_GUI_HTML_VIEWER
                
IMPORTING ACTION FRAME GETDATA POSTDATA QUERY_TABLE.
ENDCLASS.

CLASS CL_MYEVENT_HANDLER IMPLEMENTATION.

 
METHOD ON_SAPEVENT.

   
CLEAR EDACTION.
    EDACTION      
= ACTION.

    CASE ACTION.
     
WHEN 'onkeypress'.  

      your code here

      WHEN OTHERS.
   
ENDCASE.
 
ENDMETHOD.ENDCLASS.

*******An HTML template

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

<script type="text/javascript">

function displayResult()

    {

    var x;

    if(window.event) // IE8 and earlier

        {

        x=event.keyCode;

        }

    else if(event.which) // IE9/Firefox/Chrome/Opera/Safari

        {

        x=event.which;

        }

    keychar=String.fromCharCode(x);

    var FormKeyPress        = document.createElement("form");

       FormKeyPress.action = "SAPEVENT:onkeypress";

       FormKeyPress.method = "post";

       FormKeyPress.id     = "FormKeyPress";

    var Keychar          = document.createElement("input");

       Keychar.type     = "hidden";

       Keychar.name     = "keychar";

       Keychar.id       = "keychar";

       Keychar.value    = keychar;

       Keychar.readonly = "readonly";   

    FormKeyPress.appendChild(Keychar);

    var fDiv=document.getElementById("formDiv");

     fDiv.appendChild(FormKeyPress );

     FormKeyPress.submit();

    }

    </script>

    <title></title>

  </head>

  <body>

    <p>

      A function is triggered when the user presses a key in the input field.

      The function alerts the key pressed.

    </p>

    <form>

      <input type="text" onkeypress="displayResult()">

    </form>

    <div id="formDiv" style="height:1%;top:00px"></div>

  </body>

</html>

regrards

2 REPLIES 2

Former Member
0 Kudos

Hi Thomas

   The class CL_GUI_HTML_VIEWER does not respond html events but only the ON_SAPEVENT event which responds to html SUBMIT or POST events.

So try to do something as following also for more you can see the SAPHTML_EVENTS_DEMO program.

the class handler for SAPEVENT of your html viewer

CLASS CL_MYEVENT_HANDLER DEFINITION.
 
PUBLIC SECTION.
   
METHODS: ON_SAPEVENT
              
FOR EVENT SAPEVENT OF CL_GUI_HTML_VIEWER
                
IMPORTING ACTION FRAME GETDATA POSTDATA QUERY_TABLE.
ENDCLASS.

CLASS CL_MYEVENT_HANDLER IMPLEMENTATION.

 
METHOD ON_SAPEVENT.

   
CLEAR EDACTION.
    EDACTION      
= ACTION.

    CASE ACTION.
     
WHEN 'onkeypress'.  

      your code here

      WHEN OTHERS.
   
ENDCASE.
 
ENDMETHOD.ENDCLASS.

*******An HTML template

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

<script type="text/javascript">

function displayResult()

    {

    var x;

    if(window.event) // IE8 and earlier

        {

        x=event.keyCode;

        }

    else if(event.which) // IE9/Firefox/Chrome/Opera/Safari

        {

        x=event.which;

        }

    keychar=String.fromCharCode(x);

    var FormKeyPress        = document.createElement("form");

       FormKeyPress.action = "SAPEVENT:onkeypress";

       FormKeyPress.method = "post";

       FormKeyPress.id     = "FormKeyPress";

    var Keychar          = document.createElement("input");

       Keychar.type     = "hidden";

       Keychar.name     = "keychar";

       Keychar.id       = "keychar";

       Keychar.value    = keychar;

       Keychar.readonly = "readonly";   

    FormKeyPress.appendChild(Keychar);

    var fDiv=document.getElementById("formDiv");

     fDiv.appendChild(FormKeyPress );

     FormKeyPress.submit();

    }

    </script>

    <title></title>

  </head>

  <body>

    <p>

      A function is triggered when the user presses a key in the input field.

      The function alerts the key pressed.

    </p>

    <form>

      <input type="text" onkeypress="displayResult()">

    </form>

    <div id="formDiv" style="height:1%;top:00px"></div>

  </body>

</html>

regrards

0 Kudos

Hi George,

thanks a lot for your quick response and for this hint, it works...

Thomas