Add Custom Button to Shopping Cart

Embed Size (px)

DESCRIPTION

Add Custom Button to Shopping Cart

Citation preview

  • 5/28/2018 Add Custom Button to Shopping Cart

    1/11

    Generated by Jive on 2014-04-01+02:00

    1

    Add custom button to Shopping Cart

    In this document we will see how to add a custom button to the Shopping Cart and the code for this button in

    order to call to a custom component for show some data.

    This can be applied also to other documents like PO, CTR, etc.Creating the custom Component

    Goto se80 and create a new component called ZZ_SC_EXTRA_INFO:

    Retrieve the SC guid:

    We need to know the guid of the shopping cart in order to obtain some data we want to show.

    First were going to create a node in component controller to store that guid:

    http://scn.sap.com/servlet/JiveServlet/showImage/82729/3.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82728/2.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82727/1.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    2/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    2

    Create also an attribute:

    http://scn.sap.com/servlet/JiveServlet/showImage/82732/6.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82731/5.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    3/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    3

    Ok, now we need to fill this attribute, first we need to map the context node in our window, so go to the window

    and drag and drop the node:

    Now were

    going to create a parameter in the plug that will start the application, so go to the Inbound Plugs

    Tab and enter in the method HANDLEDEFAULT doing double click in the plug.

    Create the parameter:

    Now were going to use the code wizard

    in order to set the value of that guid to our context node:

    http://scn.sap.com/servlet/JiveServlet/showImage/82737/11.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82736/10.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82735/9.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82734/8.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82733/7.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    4/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    4

    DATA: lo_nd_zz_sc_guid TYPEREFTO if_wd_context_node, lo_el_zz_sc_guid TYPEREFTO if_wd_context_elem

    We need also to create a webdynpro application:

    Add the GUID as parameter using the matchcode in Parameters Tab:

    http://scn.sap.com/servlet/JiveServlet/showImage/82763/15.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82741/14.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82740/13.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82738/12.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    5/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    5

    Now, you have the guid of your shoppingcart and you

    can display the extra info you want in the main view, but I leave this part from your side.

    In my case Ive created a simple WDA adding two text edit to retrieve some data from a custom

    table, but if you want you can create a complex component for add some extra functionality to

    your solution.

    Adding the button to SC

    Define a custom action

    Go to SPRO to the following path:

    SAP Supplier Relationship Management -> SRM Server -> Cross-Application Basic Settings -> Extensions and

    Field Control (Personalization) -> Define and Assign Actions

    We need to first define the action:

    Then we need to assign that action to the SC:

    http://scn.sap.com/servlet/JiveServlet/showImage/82746/2.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82746/2.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82745/1.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82744/17.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82743/16.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    6/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    6

    Choose the set type 05 for header and the object type BUS2121 for shopping cart.

    Next step is active this action in the following path:

    Active the action for the mode Display for the

    Shopping Cart. You must set to X the checkbox PDO Action Enabled.

    At this point you can also specify a dynamic class and method for control the visualization of the button

    dynamically. In this example this is not necessary, but if you want to create one, you only need to go to tx SE24

    and create a class with the super class /SAPSRM/CL_PDO_DYN_MDA_HD and a method with the following

    parameters:

    http://scn.sap.com/servlet/JiveServlet/showImage/82749/5.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82748/4.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82747/3.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    7/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    7

    Within the parameter

    CS_METADA you have a field called ACTION_ENABLED, you need to set it to X to display the button or set to

    SPACE to hide the button.

    Changing the component configuration.

    At this point the button is not displayed in the Shopping Cart yet. Why?

    You need to change also the component configuration. Go to the portal and create a new SC. With

    the right button of the mouse choose More Field Help:

    And here you have the component name, the view and the component configuration:

    Go to that component in se80, open the folder called Component Configurations and find the

    Configuration ID:

    http://scn.sap.com/servlet/JiveServlet/showImage/82752/8.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82751/7.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82750/6.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    8/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    8

    Push the button Start Configurator and an internet browser will be opened:

    Choose Change and click in the button called Extensibility 1:

    http://scn.sap.com/servlet/JiveServlet/showImage/82754/10.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82754/10.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    9/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    9

    Ok, we need to change the data of this button with the data of our button, like this:

    We need to mark Enabled and put the name of our action in the field FPM Event ID. Also we

    need to set the Visibility to 'Visible' and fill other fields like Explanation, etc

    Push Save and now you should see our button in SC. Create a new one and try. Remember that

    we add the button only for Display mode, if you want to see the button in Edit mode you need to

    add another entry by customizing or leave empty the field Process Mode for display it in all the

    cases.

    Adding some code to the button

    Ok, now we need to add some code to our button. As we saw the webdynpro component is

    FPM_OIF_COMPONENT and the view CNR_VIEW. So, lets go to that component and view.

    In Actions tab we can see there is an action called BUTTON_PRESSED:

    http://scn.sap.com/servlet/JiveServlet/showImage/82757/13.jpghttp://scn.sap.com/servlet/JiveServlet/showImage/82756/12.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    10/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    10

    Ok, we need to create an enhancement point in order to add a post-exit for the method

    ONACTIONBUTTON_PRESSED. So, use the button and create a new one.

    Now we need to use the button to create a Post-Exit in the method ONACTIONBUTTON_PRESSED:

    For this part we need to check the standard code of that method and copying some parts and adding other

    custom parts the code could be:

    DATA: lv_id TYPE string, lv_event_id TYPE fpm_event_id. DATA: lo_nd_oif_application TYPEREFTO if_w

    We need to add the code within the CASE statement. For call our custom webdynpro we use the classes

    CL_WD_UTILITIES and IF_WD_WINDOW_MANAGER:

    DATA: lv_url TYPE string, d_url(255) TYPEc, lv_app_name TYPE string, host TYPE string, port TYPE string, o

    And now you can use the button for display the custom webdynpro you want:

    http://scn.sap.com/servlet/JiveServlet/showImage/82759/15.jpg
  • 5/28/2018 Add Custom Button to Shopping Cart

    11/11

    Add custom button to Shopping Cart

    Generated by Jive on 2014-04-01+02:00

    11