Modifying Helper UI 

Use

By default the OVS helper dialog provides all UI elements required for search query input. However, you can modify the dialog using various strategies:

●      modify the default helper UI

○       Change the title of the helper UI dialog box

○       Display an exit button

○       Determine the number of columns to position the query input fields

○       Determine which query input fields and which search result table columns are to be displayed

○       Determine the labels of the query input fields

○       Determine the titles of search result table columns

●      create your own helper UI dialog

You use your own OVS component running within the OVS popup. When the user starts a help request, Web Dynpro creates an IWDOVSControl containing all required OVS information. A IWDOVSProvider implementation is called to create an IWDOVSDialog implementation. The OVS dialog implementation creates and closes the interface window of the OVS component

●      reduce the OVS helper UI to a list of  suggestion values, filtered according to the user input

Prerequisites

●      You have created a Web Dynpro component showing at least one InputField UI element.

●      You have imported an Adaptive RFC Model that provides the relevant search data.

More information: Importing Adaptive Remote Function Call (RFC) Models

Procedure

Modifying the Default Helper UI

...

...

       1.      Create an OVS input help for an InputField UI element.

More information: Providing Search Result Value Lists (OVS)

       2.      Create an instance of class WDOVSConfigurator. Override those methods, whose behavior you want to modify. For example, use the following lines:

// create OVSConfigurator instance   WDOVSConfigurator configurator = new WDOVSConfigurator()   {     @Override     public boolean showCancelButton()     {       return true;     }   };

       3.      Create an OVSProvider using class WDValueServices.  

       4.      To define OVS startup attributes, in the view controller, add the OVS extension passing the provider.

For example, use the following lines:

// create OVSProvider IWDOVSProvider provider = WDValueServices.createOVSProvider(     wdContext.nodeOVSInput(),     wdContext.nodeOVSOutput(),     new MyOVSContextNotificationListener(),     configurator); ... // add OVSExtension WDValueServices.addOVSExtension(     "MyOVSExtension",     new IWDAttributeInfo[]{       wdContext.nodeMyNode().getNodeInfo().getAttribute("myAttr")},     provider,     null);

Creating Your Own Helper UI Dialog

...

       1.      Create an additional component containing the required search query UI (e.g. OVSComponent). In the component that triggers the OVS search query, declare a component usage for that OVS component.

       2.      Create your own IWDOVSProvider and IWDOVSDialog implementations.

The OVSDialog must exist as long as the OVS-Popup is active.

For example, use the following lines:

public class MyOVSProvider implements IWDOVSProvider {   // the component owning the attribute to which OVS is attached   private final IWDComponent component;     // the component usage used to create the OVS component   private final IWDComponentUsage componentUsage;     public MyOVSProvider(       IWDComponent component,       IWDComponentUsage componentUsage)   {     this.component = component;     this.componentUsage = componentUsage;   }   public IWDOVSDialog createOVSDialog(IWDOVSControl ovsControl)   {     // create a new dialog and pass the IWDOVSControl     return new MyOVSDialog(component, componentUsage, ovsControl);   }   public String getProviderName()   {       return getClass().getName();   } } public class MyOVSDialog implements IWDOVSDialog {   private final IWDComponentUsage componentUsage;   private final IExternalOVSComponentInterface interfaceController;   private final IWDWindow window;   private final IWDOVSControl ovsControl;   MyOVSDialog(       IWDComponent component,       IWDComponentUsage componentUsage,       IWDOVSControl ovsControl)   {     this.componentUsage = componentUsage;     this.ovsControl = ovsControl;     // create the component     componentUsage.createComponent();     // determine its interface controller     interfaceController =       (IExternalOVSComponentInterface)componentUsage         .getInterfaceController()         .wdCastTo(IExternalOVSComponentInterface.class);     // pass this to the controller     // (gives also access to the IWDOVSControl)     interfaceController.init(this);     // finally create the popup window     IWDWindowInfo windowInfo =       component.getComponentInfo().findInWindows("OVSWindow");     window =       component.getWindowManager().createModalWindow(windowInfo);   }   public void exit()   {     componentUsage.deleteComponent();   }   public IWDWindow getWindow()   {     return window;   }   public final IWDOVSControl getOvsControl()   {     return ovsControl;   } }

       3.      To define OVS startup attributes, in the view controller, add the OVS extension to the required context attributes, passing your OVS provider instance.

For example, use the following lines:

// add OVSExtension WDValueServices.addOVSExtension(     "MyOVSExtension",     new IWDAttributeInfo[]{       wdContext.nodeMyNode().getNodeInfo().getAttribute("myAttr")},     new MyOVSProvider(       wdComponentAPI,       wdThis.wdGetOVSComponentUsage()),     null);

Providing a Suggestion List

...

       1.      For the InputField UI element that the user triggers the OVS input help with, set the suggestValues property to true.

If the attribute that the InputField is bound to has a ValueSet, the corresponding values are automatically displayed while the user types some characters.

To supply the suggestion list via OVS however, you must implement the IWDOVSSuggester interface.

       2.      Implement the IWDOVSSuggester interface. Use the suggest method to fill the suggester list, use the finalize method to pass the user’s selection to the input field.