Skip to Content

Creating a BSP Extension Element for editing in Word

This weblog will show you how to create a BSP Element that makes use of Microsofts DSO Framer to embed word into a BSP page. This makes it possible to edit server side word documents using a BSP page.

The DSO framer is key to getting the editing capability from word as it allows you to host office documents inside HTML pages and interact with the objects methods using VBScript or Javascript.

The example uses a combination of Javascript and VBScript to extract the data from the framer and posted back to the server as a form field (named hiddendata).

The following screen capture shows the word document with tables and embedded images.

image

The example is using Word XML format for the document (WML). The initial value for the document is determined in the controller.

BSP Application

image

Attribute

The class has a single attribute.

ms_data type string private

This is used to store the current data.

Methods

The two redefined methods.

do_request

The do_request method creates the view and initialises the data.

METHOD do_request.

  DATA: lv_comp            TYPE string,

        lo_view            TYPE REF TO if_bsp_page.

  dispatch_input( ).

  • If the data is initial then use a default hello world

  IF ms_data IS INITIAL.

    CONCATENATE

          ‘<w:wordDocument xmlns:w=”http://schemas.microsoft.com/office/word/2003/wordml“>’

            ‘<w:body>’

              ‘<w:p>’

                ‘<w:r>’

                  ‘<w:t>Hello, word World.</w:t>’

                ‘</w:r>’

              ‘</w:p>’

            ‘</w:body>’

          ‘</w:wordDocument>’

     INTO ms_data SEPARATED BY cl_abap_char_utilities=>cr_lf.

  ENDIF.

  • Create and display the views

  lo_view = create_view( view_name = ‘editorview.htm’ ).

  lo_view->set_attribute( name = ‘ms_document’ value = ms_data ).

  call_view( lo_view ).

ENDMETHOD.

do_handle_data

The do_handle_data method retrieves the changed data and stores it in an instance attribute of the controller.

METHOD do_handle_data.

  DATA lv_line LIKE LINE OF form_fields.

  • Get the hiddendata field from the form processing.

  READ TABLE form_fields INTO lv_line WITH KEY name =’hiddendata’.

  IF sy-subrc EQ 0.

    ms_data = lv_line-value.

  ENDIF.

ENDMETHOD.

BSP Element

The BSP element is responsible for creating the HTML that renders the control on the display.

Properties

image

Create the Element with the a single attribute

A single attribute containing the document data is used.

image

Method implementation.

This is the main part of the example. It generates the HTML and stores the data for the control in an XML island. The island is one possible approach to the data, setting the value for a form field is another option, but this may require encoding of the data for storage.

The javascript function ZjaDoValidate is added to the parent forms validation code. Another option here is to have an onClientClick handler for the button that can be used to transfer the data from the framer to the hidden field prior to form submission.

The example also includes 2 delays. There may be an event that can be used to load the data to the framer once the control loads, but as yet we haven’t found it. For the sake of this example a delay is used between laoding the control and setting its data. In practice this is really bad as a race condition is created. However for the sake of demonstration it works for now.

METHOD if_bsp_element~do_at_beginning.

  DATA:

       lv_wordml         TYPE string,

       lv_id             TYPE string,

       lv_string         TYPE string.

  • The ID of the form field for processing the data.

  lv_id = ‘”HIDDENDATA”‘.

  • An XML data island is used to store the data. This could also be directly assigned to the hidden field

  CONCATENATE ”

  INTO lv_wordml.

  • Insert two VBScript functions and XML data island into page

  CONCATENATE lv_wordml

              ”


INTO lv_string SEPARATED BY cl_abap_char_utilities=>cr_lf.

  • Insert the control for the DSO framer

  CONCATENATE lv_string

               ‘














INTO lv_string.
me->

print_string( lv_string ).

  • This adds the script to the form validation. This can also be achieved via an onClientClick

  • for the button

  DATA: lo_formx TYPE REF TO cl_htmlb_form,

        lv_text  TYPE string.

  lo_formx ?= me->get_class_named_parent( ‘CL_HTMLB_FORM’ ).

  IF lo_formx IS NOT INITIAL.

    CONCATENATE lo_formx->setup_validation ‘ if (!ZjaDoValidate( )) return false; ‘”#EC NOTEXT

           INTO lo_formx->setup_validation.

  ENDIF.

ENDMETHOD.

With this in place and the DSO framer installed on your PC (I guess this won’t work on my Mac) you can run the BSP application and make edits to the document. I had no problem creating tables and embedding images, such is the beauty of WML.

+

Thanks also go to Jesse Bush and Steve Keyes for finding the DSP framer and figuring out how to use it.+

To report this post you need to login first.

8 Comments

You must be Logged on to comment or reply to a post.

  1. Alvaro Tejada Galindo
    Hi John:

    Great blog as always…And very simple aproach to get something that powerfull. I really need to buy Horst Keller Book and get the MiniWas…I really need to learn some BSP Programming.

    Greetings,

    Blag.

    (0) 
    1. Peter Inotai
      > I really need to buy Horst Keller Book and get the MiniWas
      You can download MiniWas 700 from SDN, it’s more fun to work with the latest release …. however Horst’s book is very useful, so it worth to order it:-)
      (0) 
        1. Thomas Jung
          On the SDN Download Page under WebAS there is the following entry:
          Sneak Preview SAP NetWeaver 04s – Full ABAP Edition with Web Dynpro for ABAP

          This is an ABAP 04s system that runs on Windows and MaxDB. 

          (0) 
  2. Kai Eckardt
    I hope someone could help me. This solution works fine with word 2003 SP2, but we must run it on an older Release with word 2002 SP3. There appears a Javascrict-Error like “The object does not support the method: selection.insertXML”. Does someone know anything about? Many Thanks and best regards
    Kai
    (0) 

Leave a Reply