How to... Select Multiple Values in a Dropdown Box

7/29/2019 How to... Select Multiple Values in a Dropdown Box

1/15

How-to Guide

SAP NetWeaver 04

How ToSelect MultipleValues within aDropdown Box

Version 1.00 February 2006

Applicable Releases:SAP NetWeaver 04BW 3.x


2/15

Copyright 2006 SAP AG. All rights reserved.

No part of this publication may be reproduced ortransmitted in any form or for any purpose without the

express permission of SAP AG. The information

contained herein may be changed without prior notice.

Some software products marketed by SAP AG and its

distributors contain proprietary software components of

other software vendors.

Microsoft, Windows, Outlook,and PowerPoint

are

registered trademarks of Microsoft Corporation.

IBM, DB2, DB2 Universal Database, OS/2, Parallel

Sysplex, MVS/ESA, AIX, S/390, AS/400, OS/390, OS/400,

iSeries, pSeries, xSeries, zSeries, z/OS, AFP, Intelligent

Miner, WebSphere, Netfinity, Tivoli, and Informix are

trademarks or registered trademarks of IBM Corporation

in the United States and/or other countries.

Oracle is a registered trademark of Oracle Corporation.

UNIX, X/Open, OSF/1, and Motif are registered

trademarks of the Open Group.

Citrix, ICA, Program Neighborhood, MetaFrame,

WinFrame, VideoFrame, and MultiWinare trademarks

or registered trademarks of Citrix Systems, Inc.

HTML, XML, XHTML and W3C are trademarks or

registered trademarks of W3C, World Wide Web

Consortium, Massachusetts Institute of Technology.

Java is a registered trademark of Sun Microsystems, Inc.

JavaScript is a registered trademark of Sun Microsystems,Inc., used under license for technology invented and

implemented by Netscape.

MaxDB is a trademark of MySQL AB, Sweden.

SAP, R/3, mySAP, mySAP.com, xApps, xApp, and other

SAP products and services mentioned herein as well as

their respective logos are trademarks or registered

trademarks of SAP AG in Germany and in several other

countries all over the world. All other product and

service names mentioned are the trademarks of theirrespective companies. Data

contained in this document serves informational

purposes only. National product specifications may vary.

These materials are subject to change without notice.

These materials are provided by SAP AG and its affiliated

companies ("SAP Group") for informational purposes

only, without representation or warranty of any

kind, and SAP Group shall not be liable for errors or

omissions with respect to the materials. The only

warranties for SAP Group products and services are those

that are set forth in the express warranty statements

accompanying such products and services, if any.

Nothing herein should be construed as constituting an

additional warranty.

These materials are provided as is without a warranty

of any kind, either express or implied, including but not

limited to, the implied warranties of merchantability,

fitness for a particular purpose, or non-infringement.

SAP shall not be liable for damages of any kind including

without limitation direct, special, indirect, or

consequential damages that may result from the use of

these materials.

SAP does not warrant the accuracy or completeness of

the information, text, graphics, links or other items

contained within these materials. SAP has no control

over the information that you may access through the

use of hot links contained in these materials and does not

endorse your use of third party web pages nor provide

any warranty whatsoever relating to third party web

pages.

SAP NetWeaver How-to Guides are intended to

simplify the product implementation. While specific

product features and procedures typically are explained

in a practical business context, it is not implied that those

features and procedures are the only approach in solving

a specific business problem using SAP NetWeaver. Shouldyou wish to receive additional information, clarification

or support, please refer to SAP Consulting.

Any software coding and/or code lines / strings (Code)

included in this documentation are only examples and

are not intended to be used in a productive system

environment. The Code is only intended better explain

and visualize the syntax and phrasing rules of certain

coding. SAP does not warrant the correctness and

completeness of the Code given herein, and SAP shall

not be liable for errors or damages caused by the usage of

the Code, except if such damages were caused by SAPintentionally or grossly negligent.


3/15

- 1 -

1 Scenario

Using dropdown boxes within web templates greatly simplifies filtering and cross-

sectional views of data. Although dropdowns greatly simplify navigation, they have a fewmajor limitations:1. It is not possible to select multiple values or2. Search by key or text

This paper will address these scenarios by providing two options to address theseissues. The first option is to enhance the dropdown to include a select multiple option.Keep in mind that this option is included in the Web Analyzer using Netweaver 2004s.This paper will address this functionality in BI 3.x.

The functionality will look as follows:

When you choose Select Multiple, the following help service is called:

The second option is to provide a multiple select form with a Submit button.


4/15

- 2 -

2 Introduction

This paper describes how to set filter values. For setting variable values, please see thepaper on how to set variable values. Also, this paper doesnt include internal to externalconversions (and vice versa) that are needed for some date conversions. Please see theaddendum at the end of the document for additional information on date conversions.

The example web template in the appendix will output similar to this:


5/15

- 3 -

3 The Step By Step Solution

3.1 Option 1 Add Select Multiple Value dialog to a dropdown box

This solution will utilize a query and build the select multiple value feature within a Webtemplate based on infoobject 0CALMONTH.

1. Create a query for use within a webtemplate. This example will useInfoObject 0CALMONTH.

2. Create a web template with adropdown box and a table. Assignyour query as the data provider forboth your dropdown and table.


6/15

- 4 -

3. Change the followingproperties for thedropdown box item:

Uncheck Generatecaption

Select 0CALMONTHas thecharacteristic/structure

Check Display onlyvalue

Make sure Do notdisplay All value isunchecked.

ITEM:DROPDOWNBOX_1

4. Switch to the HTML viewand surround yourdropdown box object witha and a tag within theform. Name the form aswell as the select. Theselect onchange eventwill trigger a JavaScriptfunction which will bedefined later. Also, addan OPTION_VALUE with

text Select Multiple andvalue.Within the JavaScriptfunction, you will pass 3parameters. The firstparameter is theInfoObject, the secondparameter is the filtervalue, and the thirdparameter is the dataprovider.

CalendarYear/Month:SelectMultiple

ITEM:DROPDOWNBOX_1


7/15

- 5 -

5. Within the tag ofthe page, add thefollowing JavaScriptfunction.

6. Save and Execute theweb template. It shouldlook as follows:


8/15

- 6 -

3.2 Option 2 Create a Select Multiple Value Listbox with a submit button

This solution will utilize a query and build a listbox with a submit button to select multiple

values within a Web template based on infoobject 0CALMONTH.1. Create a query for use

within a web template.This example will useInfoObject0CALMONTH.

2. Create a web templatewith a dropdown boxand a table. Assignyour query as the dataprovider for both yourdropdown and table.

3. Change the followingproperties for the

dropdown box item:

Uncheck Generatecaption

Select 0CALMONTHas thecharacteristic/structure

Check Display onlyvalue

Make sure Do notdisplay All value is

unchecked.

ITEM:DROPDOWNBOX_3


9/15

- 7 -

4. Switch to the HTML viewand surround yourdropdown box object witha and a tag within theform. Name the form aswell as the select. Theselect onchange eventwill trigger a JavaScriptfunction which will bedefined later. Also, addan OPTION_VALUE withtext Select Multiple andvalue.Within the JavaScriptfunction, you will pass 3parameters. The first

parameter is theInfoObject, the secondparameter is the filtervalue, and the thirdparameter is the dataprovider.

CalendarYear/Month:

ITEM:DROPDOWNBOX_3Submit

5. Within the tag ofthe page, add thefollowing JavaScriptfunction.


10/15

- 8 -

6. Save and Execute theweb template. It shouldlook as follows:


11/15

- 9 -

4 Addendum

This section includes some additional code for date conversions or for settingvariable values. For more details please see the white paper on setting variable

values via a dropdown.

//ConvertInteralDatestoExternalDates//Functionchavl_int_to_ext_convert(intformat,iobjnm)//intformat=dateininternalformat//iobjnm=infoobjectfunctionchavl_int_to_ext_convert(intformat,iobjnm){vardate_format=SAPBWGetProperty('DATE_FORMAT');if(iobjnm=='0CALMONTH'){switch(date_format){case1:returnintformat.substring(4,6)+'.'+intformat.substring(0,4);

case2:returnintformat.substring(4,6)+'/'+intformat.substring(0,4);case3:returnintformat.substring(4,6)+'-'+intformat.substring(0,4);case4:returnintformat.substring(0,4)+'.'+intformat.substring(4,6);case5:returnintformat.substring(0,4)+'/'+intformat.substring(4,6);case6:returnintformat.substring(0,4)+'-'+intformat.substring(4,6);}}if(iobjnm=='0FISCPER'){switch(date_format){case1:returnintformat.substring(6,9)+'.'+intformat.substring(2,6);case2:returnintformat.substring(6,9)+'/'+intformat.substring(2,6);case3:returnintformat.substring(6,9)+'-'+intformat.substring(2,6);case4:returnintformat.substring(2,6)+'.'+intformat.substring(6,9);

case5:returnintformat.substring(2,6)+'/'+intformat.substring(6,9);case6:returnintformat.substring(2,6)+'-'+intformat.substring(6,9);}}}//ConvertExternalDatestoInternalDates//Functionchavl_ext_to_int_convert(extformat,iobjnm)//extformat=dateinexternalformat//iobjnm=infoobjectfunctionchavl_ext_to_int_convert(extformat,iobjnm){vardate_format=SAPBWGetProperty('DATE_FORMAT');if(iobjnm=='0CALMONTH'){//possiblevaluesDATE_FORMAT:Dateformat(1:DD.MM.YYYY,2:MM/DD/YYYY,3:MM-DD-YYYY,//4:YYYY.MM.DD,5:YYYY/MM/DD,6:YYYY-MM-DD)if(date_format


12/15

- 10 -

}}//SetsVariableValuesforavariable//FunctionsetVariable(value,variablename,iobjnm)//value=thevalueyouwanttosetthevariableto//variablename=thetechnicalnameofthevariablethatyouwanttoset//iobjnm=infoobjectthatthevariableisbuiltupon

functionsetVariable(value,variablename,iobjnm){//ignorethe'#'and"!ALL"valuesif(value=='000000'||value=='!ALL')alert("Pleaseselectavalidmonth.");else{url=SAP_BW_URL_Get()+"&CMD=PROCESS_VARIABLES&SUBCMD=VAR_SUBMIT&VAR_NAME_1="+variablename+"&VAR_VALUE_EXT_1=";url=url+chavl_int_to_ext_convert(value,iobjnm);SAPBWOpenURL(url);}}

5 Appendix (Web Template Example)

DATA_PROVIDER:DATAPROVIDER_1

TEMPLATEPROPERTIESBWWebApplication


13/15

- 11 -

SAPBWOpenURL(SAP_BW_URL_Get()+"&DATA_PROVIDER="+dataprov+"&FILTER_IOBJNM="+iobjnm+"&FILTER_VALUE="+val+"&FILTER_COLLAPS=");}}functionsetMultiFilter(iobjnm,dataprov){value='';

url=SAP_BW_URL_Get()+'&DATA_PROVIDER='+dataprov+'&FILTER_IOBJNM='+iobjnm;//loopthroughallthevalues,gettingthevalueofthosethatareselectedfor(i=0;i

Thisdropdownisthestandarddropdownwebitem:Thisdropdownhastheselectmultiplevalueoptionwithinthedropdown:

Thisformlistallowsyoutoselectmultiplevaluesandsubmitthefilters:

ITEM:DROPDOWNBOX_2CalendarYear/Month:SelectMultiple


14/15

- 12 -

ITEM:DROPDOWNBOX_1

CalendarYear/Month:

ITEM:DROPDOWNBOX_3Submit

ITEM:TABLE_1


15/15

www.sdn.sap.com/irj/sdn/howtoguides

Documents

How to... Select Multiple Values in a Dropdown Box