Drop-downs in ALV: display list of code & value

Hi All.
When you define a Drop-down in Screen-editor (SE51) you'll get a field that contains list of code & value (if you set the "Show key within dropdown lists" option in the SAPGUI).
I would like to see the same behaviour in ALV Drop-downs. Currently there are 2 options: create a list that shows codes only, or create a that shows the values and the codes are hidden.
Both these options are set via the tables in Method "SET_DROP_DOWN_TABLE" of the CL_GUI_ALV_GRID class ([this is an example of how to set it|List Box in ALV Grid;).
Any idea how to set it will be welcome and rewarded.
Regards.
Ayal Telem.

Hi Ridhima,
I need a drop down field in ALV list for my ABAP report. The user will select one of them and the report will go with this selection. How do you make such thing? I need it too..

Similar Messages

Insert data in drop down in alv at run time.

Hi Gurus,
I have to insert data in the dropdown wich is in alv at run time.According to my requirement i have i fill my drop down in the init but depend upon some conditions i have to insert one more vaule in the drop down at the run time.
My problem is that i have filled the drop down with new data but it is not displayed in at the alv output.It is working fine without alv.
Thanks & Regards.

Hi,
As per my understanding you want to update values in the drop down, on enter event of some other field.
For that you have written the code for drop down twice 1) in the init method 2) in the on enter event of one field, right?
If the code is not working in the on enter event, I think you can still use 'WDDOMODIFYVIEW' method. Follow the below steps:
1) create one attribute of type char1 in the attributes tab of the view
2) Set the value of that attribute to 'X' in the on enter event of other field (where you have written the code for drop down)
3) In 'WDDOMODIFYVIEW' method, check the value of attribute. If this is 'X' run the code for updating drop down, then clear the value of attribute
Regards,
Saket.

How does one come to know this..drop down in ALV in WD

Hello Friends,
                      I had a requirement of adding a drop down in ALV, i eventually got it but I have some questions about it
I used the following code and got the drop down
lr_column = lr_column_settings->get_column( 'BWART' ).
CREATE OBJECT lr_input_field
    EXPORTING
      value_fieldname = 'BWART'.
lr_column->set_cell_editor( lr_input_field ).
DATA : LR_DROPDOWN TYPE REF TO CL_SALV_WD_UIE_DROPDOWN_BY_KEY.
CREATE OBJECT LR_DROPDOWN EXPORTING SELECTED_KEY_FIELDNAME = 'BWART'.
LR_COLUMN->SET_CELL_EDITOR( LR_DROPDOWN ).
DATA: LT_VALUESET TYPE TABLE OF WDR_CONTEXT_ATTR_VALUE,
LS_VALUESET TYPE WDR_CONTEXT_ATTR_VALUE,
LR_NODE TYPE REF TO IF_WD_CONTEXT_NODE,
LR_NODEINFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO.
LR_NODE = WD_CONTEXT->GET_CHILD_NODE( 'RETURN_NODE' ).
LR_NODEINFO = LR_NODE->GET_NODE_INFO( ).
LS_VALUESET-VALUE = '973'.
LS_VALUESET-TEXT = '973'.
APPEND LS_VALUESET TO LT_VALUESET.
LS_VALUESET-VALUE = '222'.
LS_VALUESET-TEXT = '222'.
APPEND LS_VALUESET TO LT_VALUESET.
LR_NODEINFO->SET_ATTRIBUTE_VALUE_SET( EXPORTING NAME = 'BWART' VALUE_SET = LT_VALUESET ).
My question is ... how does 1 know which class to use? how to use that class... most of concepts about OOPS are clear.. but i still cant figure out how does 1 find out which class to use.. is it all by expericence..

In short: Yes, by experience. Then again, for WD4A there is a class for each UI-Element available. Once you know this, you can easily search se24 for CLWD<UI-NAME>* or the like.

How to configure drop down menu in custom list

Hi,
I want to create custom list with 3 options. Active, Proposal and Completed. How can I create drop down menu like this (look at picture).

Hi,
According to your post, my understanding is that you wanted to configure drop down menu in custom list.
I suggest to modify the view to group by Preposition Status.
You can follow the steps as below:
Create list, add choice column named Preposition Status.
Add items.
Modify the view as below:
Then the result is as below:
Thank you for your understanding.
Best Regards,
Linda Li
Linda Li
TechNet Community Support

On my drop down menus, the items listed are appearing twice.

On my drop down menus, the items listed are appearing twice. For instance, there are two "shut down" and two "restart." How do I fix this?

Hi Peter, and a warm welcome to the forums!
See Tom Gewecke's post here...
http://discussions.apple.com/thread.jspa?messageID=4395251&#4395251
This problem has been reported serveral times. It seems to be a loss of access to the main system font. I've not heard of any cure except a reinstall.
It appears to be time for a relatively painless Archive & Install, which gives you a new/old OS, but can preserve all your files, pics, music, settings, etc., as long as you have plenty of free disk space and no Disk corruption, and is relatively quick & painless...
http://docs.info.apple.com/article.html?artnum=107120
Just be sure to select Preserve Users & Settings.

I have made one field as drop down in web ui. there are 3 values in drop down suppose a, b , c.

i have made one field as drop down in web ui. there are 3 values in drop down suppose a, b , c.
now i want to make c value as default value in drop down what to do?

Hello Bala,
you can find number of discussions regarding this on SCN.
Search and do code in DO_INIT_CONTEXT method of view to set the value in entity.
lr_entity ?= me->typed_context->context_node_name->collection_wrapper->get_current( ).
lr_entity->set_property( iv_attr_name = 'Attribute_name' iv_value = 'value' ).
Regards Harish Kumar

Version 3.6.17 Horizontal drop down menu is displaying as vertical text list. Page style set to basic. Menu works fine in Internet Explorer. Any hints?

Newly installed horizontal drop down menu works in IE. In Firefox, it displays as a vertical text list. Any hints?

Clear the cache and the cookies from sites that cause problems.
"Clear the Cache":
* Tools > Options > Advanced > Network > Offline Storage (Cache): "Clear Now"
"Remove the Cookies" from sites causing problems:
* Tools > Options > Privacy > Cookies: "Show Cookies"
Start Firefox in <u>[[Safe Mode]]</u> to check if one of the extensions is causing the problem (switch to the DEFAULT theme: Firefox (Tools) > Add-ons > Appearance/Themes).
* Don't make any changes on the Safe mode start window.
* https://support.mozilla.com/kb/Safe+Mode
* https://support.mozilla.com/kb/Troubleshooting+extensions+and+themes

Drop down in ALV List

Hi,
Is drop down feature available in ALV using
REUSE_ALV_LIST_DISPLAY ?
If Yes, How i can acheive that ?
Thanks.

Edited by: Maré Pretorius on Jun 9, 2009 7:09 PM
Edited by: Maré Pretorius on Jun 9, 2009 7:23 PM

Drop Down in ALV ABAP and NOT in OO - ABAP

Hello Everyone....
I m workin on an ALV which is in simple ABAP and not in OO-ABAP. There is some selection criteria on the first screen , as soon as the user fulfills the requirement an ALV GRID is displayed in which the last column is editable.
But the Problem is that i wanna make that editable field in ALV as drop down which would contain values from the database table.
Suggest me some method , so that i dont have to do much changes in my code .
A Sample code will be very benificial .
Thanx n Regards,
Harpreet.

Hi Harpreet,
[compiled from sap online help - always a good chice]
To make an input/output field into a list box, you must set the value L or LISTBOX in the Dropdown attribute in the Screen Painter. The visLg attribute determines the output width of the list box and the field. You can assign a function code to a list box field. In this case, the PAI event is triggered as soon as the user chooses a value from the list, and the function code is placed in the SY-UCOMM and OK_CODE fields. If you do not assign a function code, the PAI event must be triggered in the usual way that is, when the user chooses a pushbutton or an element from the GUI status.
If you have assigned a list box to an input/output field, you can use the Value list attribute of the screen element to determine how the value list should be compiled. There are two options:
Value list from input help (recommended)
If you do not enter anything in the value list attribute, the text field uses the first column displayed in the input help assigned to the screen field. The input help can be defined in the ABAP Dictionary, the screen, or a POV dialog module. It should be laid out in two columns. The key is automatically filled.
Value list from PBO modules (not recommended).
If you enter A in the value list attribute, you must fill the value list yourself before the screen is sent (for example, in the PBO event) using the function module VRM_SET_VALUES. When you do this, you must pass an internal table with the type VRM_VALUES to the import parameter VALUES of the function module. VRM_VALUES belongs to the type group VRM. The line type is a structure consisting of the two text fields KEY (length 40) and TEXT (length 80). In the table, you can combine possible user entries from the KEY field with any texts from the TEXT component. You specify the corresponding input/output field in the import parameter ID.
Examples
Example
Dropdown box with a value list from input help (recommended)
*& Report DEMO_DROPDOWN_LIST_BOX                                 *
REPORT demo_dropdown_list_box.
*& Global Declarations                                           *
* Screen Interfaces
TABLES sdyn_conn.
DATA   ok_code TYPE sy-ucomm.
* Global data
TYPES: BEGIN OF type_carrid,
         carrid type spfli-carrid,
         carrname type scarr-carrname,
       END OF type_carrid.
DATA itab_carrid TYPE STANDARD TABLE
     OF type_carrid WITH HEADER LINE.
*& Processing Blocks called by the Runtime Environment           *
* Event Block START-OF-SELECTION
START-OF-SELECTION.
CALL SCREEN 100.
* Dialog Module PBO
MODULE status_0100 OUTPUT.
SET PF-STATUS 'SCREEN_100'.
ENDMODULE.
* Dialog Modules PAI
MODULE cancel INPUT.
LEAVE PROGRAM.
ENDMODULE.
MODULE user_command_0100 INPUT.
CASE ok_code.
    WHEN 'SELECTED'.
      MESSAGE i888(sabapdocu) WITH sdyn_conn-carrid.
ENDCASE.
ENDMODULE.
* Dialog Module POV
MODULE create_dropdown_box INPUT.
SELECT carrid carrname
                FROM scarr
                INTO CORRESPONDING FIELDS OF TABLE itab_carrid.
CALL FUNCTION 'F4IF_INT_TABLE_VALUE_REQUEST'
       EXPORTING
            retfield        = 'CARRID'
            value_org       = 'S'
       TABLES
            value_tab       = itab_carrid
       EXCEPTIONS
            parameter_error = 1
            no_values_found = 2
            OTHERS          = 3.
IF sy-subrc <> 0.
ENDIF.
ENDMODULE.
The next screen (statically defined) for screen 100 is 100. The only input field on the screen is the component SDYN_CONN-CARRID. Its Dropdown attribute is set to L, and it has the output length 20. The Value list attribute is empty, and it has the function code SELECTED. The function codes of the buttons EXECUTE and CANCEL. CANCEL are defined in the GUI status as having the function type E.
The screen flow logic is as follows:
PROCESS BEFORE OUTPUT.
MODULE status_0100.
PROCESS AFTER INPUT.
MODULE cancel AT EXIT-COMMAND.
MODULE user_command_0100.
PROCESS ON VALUE-REQUEST.
FIELD sdyn_conn-carrid MODULE create_dropdown_box.
Users cannot enter any values into the screen fields. When they choose the input field on screen 100, the system displays a list box. The Value list attribute is empty, so the system launches the input mechanism. In this case, the event block PROCESS ON VALUE-REQUEST is created in the screen flow logic. This event block controls all other mechanisms. A two-column internal table is filled in the appropriate dialog module and passed to the input help using the F4IF_INT_TABLE_VALUE_REQUEST function module. The system inserts the two columns of the table into the list box.
When the user chooses a line in the list box, the PAI event is triggered using the function code SELECTED and the value in the first column of the internal table is copied to the input field.
Regards,
Clemens

Drop Down in ALV

Hi,
i have a problem to insert value in drop down list in ALV. (I want to use this call function CALLFUNCTION 'REUSE_ALV_GRID_DISPLAY_LVC' or 'REUSE_ALV_GRID_DISPLAY)
How can i insert directly in ABAP 3 value. Example of code you can test this :
report ZCO_AFFACT_TEST.
* type pools
TYPE-POOLS: SLIS.
* declarations for alv and internal tables
DATA: IT_FIELDCAT TYPE LVC_T_FCAT,
WA_FIELDCAT TYPE LVC_S_FCAT,
WA_LAYOUT TYPE LVC_S_LAYO,
V_POSITION TYPE I ,
LS_CELLCOLOR TYPE LVC_S_SCOL,
L_INDEX TYPE SY-TABIX.
DATA: BEGIN OF IT_VBAP OCCURS 0,
VBELN LIKE VBAP-VBELN,
POSNR LIKE VBAP-POSNR,
flag LIKE ztypfac-flag,
CELLCOLOR TYPE LVC_T_SCOL,
END OF IT_VBAP.
* start of selection
start-of-selection .
*---get data from db table
perform get_data .
*---build layout for alv
perform build_layout .
*---build fieldcat for alv
perform build_fieldcat .
*---modify fieldcat for colors in alv
Perform modify_fieldcat .
*---display alv
perform display_alv .
*& Form get_data
FORM get_data .
SELECT VBELN
POSNR
UP TO 25 ROWS
INTO CORRESPONDING FIELDS OF TABLE IT_VBAP
FROM VBAP.
ENDFORM. " get_data
*& Form build_fieldcat
FORM build_fieldcat .
WA_FIELDCAT-FIELDNAME = 'VBELN'.
WA_FIELDCAT-REPTEXT   = 'VBELN'.
WA_FIELDCAT-edit      = 'X'.
WA_FIELDCAT-drdn_hndl = '1'. "I have had
APPEND WA_FIELDCAT TO IT_FIELDCAT.
CLEAR WA_FIELDCAT.
WA_FIELDCAT-FIELDNAME = 'POSNR'.
WA_FIELDCAT-REPTEXT = 'POSNR'.
APPEND WA_FIELDCAT TO IT_FIELDCAT.
WA_FIELDCAT-FIELDNAME = 'FLAG'.
WA_FIELDCAT-REPTEXT = 'FLAG'.
APPEND WA_FIELDCAT TO IT_FIELDCAT.
CLEAR WA_FIELDCAT.
ENDFORM. " build_fieldcat
*& Form build_layout
FORM build_layout .
WA_LAYOUT-CTAB_FNAME = 'CELLCOLOR'.
WA_LAYOUT-ZEBRA = 'X'.
ENDFORM. " build_layout
*& Form modify_fieldcat
FORM modify_fieldcat .
LOOP AT IT_VBAP.
L_INDEX = SY-TABIX.
if l_index = 5 or l_index = 15.
LS_CELLCOLOR-FNAME = 'VBELN'.
LS_CELLCOLOR-COLOR-COL = '6'.
LS_CELLCOLOR-COLOR-INT = '1'.
APPEND LS_CELLCOLOR TO IT_VBAP-CELLCOLOR.
MODIFY IT_VBAP INDEX L_INDEX TRANSPORTING CELLCOLOR.
endif.
if l_index = 10 or l_index = 20.
LS_CELLCOLOR-FNAME = 'VBELN'.
LS_CELLCOLOR-COLOR-COL = '4'.
LS_CELLCOLOR-COLOR-INT = '1'.
APPEND LS_CELLCOLOR TO IT_VBAP-CELLCOLOR.
MODIFY IT_VBAP INDEX L_INDEX TRANSPORTING CELLCOLOR.
endif.
if it_vbap-VBELN is initial .
delete it_vbap.
endif.
ENDLOOP.
ENDFORM. " modify_fieldcat
*& Form display_alv
FORM display_alv .
CALL FUNCTION 'REUSE_ALV_GRID_DISPLAY_LVC'
EXPORTING
I_CALLBACK_PROGRAM = SY-REPID
IS_LAYOUT_LVC       = WA_LAYOUT
IT_FIELDCAT_LVC     = IT_FIELDCAT
TABLES
T_OUTTAB = IT_VBAP .
ENDFORM. " display_alv
Thank you for your answers!
Edited by: Emilien P. on Jun 30, 2010 10:42 AM

Finaly i have user OO because all the example use the Object...
With my old ALV i have used User command and Hotspot, it is very easy to use.
Now with the OO i have a problem to manage the hot spot and a cell, when i am in mode debug /h when i click on the cell with the hotspot nothing happen !!! I don't undertand what is missing
report ZCO_AFFACT_TEST.
Tables : VBRK, VBRP,ZTYPFAC.
*-- Global data definitions for ALV
*--- ALV Grid instance reference
DATA gr_alvgrid TYPE REF TO cl_gui_alv_grid .
*--- Name of the custom control added on the screen
DATA gc_custom_control_name TYPE scrfname VALUE 'CC_ALV' .
*--- Custom container instance reference
DATA gr_ccontainer TYPE REF TO cl_gui_custom_container .
*--- Field catalog table
DATA gt_fieldcat TYPE lvc_t_fcat .
*--- Layout structure
DATA gs_layout TYPE lvc_s_layo.
types : begin of wls_facture,
       ...        END OF wls_facture.
types : begin of wls_resultat,
      ...        END OF wls_resultat.
data : wlt_facture type TABLE OF wls_facture,
       wls_facture type          wls_facture,
       wlt_final   type TABLE OF wls_resultat,
       wls_final   type          wls_resultat.
PERFORM BUILD_DATA.
PERFORM display_alv.
end-of-selection.
call SCREEN 1000.
"display_alv OUTPUT
*&      Form display_alv
*       text
FORM display_alv .
IF gr_alvgrid IS INITIAL .
*----Creating custom container instance
    CREATE OBJECT gr_ccontainer
      EXPORTING
        container_name              = gc_custom_control_name
      EXCEPTIONS
        cntl_error                  = 1
        cntl_system_error           = 2
        create_error                = 3
        lifetime_error              = 4
        lifetime_dynpro_dynpro_link = 5
        others                      = 6.
    IF sy-subrc <> 0.
*--Exception handling
    ENDIF.
*----Creating ALV Grid instance
    CREATE OBJECT gr_alvgrid
      EXPORTING
        i_parent          = gr_ccontainer
      EXCEPTIONS
        error_cntl_create = 1
        error_cntl_init   = 2
        error_cntl_link   = 3
        error_dp_create   = 4
        others            = 5.
    IF sy-subrc <> 0.
*--Exception handling
    ENDIF.
*----Preparing field catalog.
    PERFORM prepare_field_catalog CHANGING gt_fieldcat .
*----Preparing layout structure
    PERFORM prepare_layout CHANGING gs_layout .
    PERFORM prepare_drilldown_values.
*----Here will be additional preparations
*--e.g. initial sorting criteria, initial filtering criteria, excluding
*--functions
    CALL METHOD gr_alvgrid->set_table_for_first_display
        EXPORTING
     is_layout                     = gs_layout
        CHANGING
      it_outtab                    = wlt_final
      it_fieldcatalog              = gt_fieldcat
    EXCEPTIONS
      invalid_parameter_combination = 1
      program_error                 = 2
      too_many_lines                = 3
      OTHERS                        = 4 .
    IF sy-subrc <> 0.
*--Exception handling
    ENDIF.
ELSE .
    CALL METHOD gr_alvgrid->refresh_table_display
      EXCEPTIONS
        finished       = 1
        OTHERS         = 2 .
ENDIF .
ENDFORM .                    "display_alv
If anybody have an idea Thanks a lot !
Emilien
Edited by: Emilien P. on Jul 1, 2010 4:21 PM

Hebrew fonts from drop-down box not displaying in text box.

I am using InDesign CS 5.5 on a Mac 10.8.4.
When in ID, the fonts I am seeing on the Font dropdown menu when I try to use in a text box are not displaying correctly. They only display as boxes. The fonts are in the Hebrew language. They are properly installed in the FontBook.
Please help!! Thank you.

Reema,
I followed most of your steps. I have a question reg. step 3 ie populating data in node 1.
Here is my code:
method WDDOINIT .
types: begin of zs,
zktokd type kna1-ktokd,
end of zs.
data: handle1 type ref to if_wd_context_node,
begin of zstruct,
zktokd type kna1-ktokd,
end of zstruct,
zitab type table of zs.
handle1 = wd_context->get_child_node( name = 'NODE1' ).
*select ktokd into corresponding fields of zstruct from kna1.
*append zstruct to zitab.
*endselect.
zstruct-zktokd = 'Sold-to party'.
append zstruct to zitab.
zstruct-zktokd = 'Goods recipient'.
append zstruct to zitab.
zstruct-zktokd = 'Payer'.
append zstruct to zitab.
zstruct-zktokd = 'Bill-to party'.
append zstruct to zitab.
zstruct-zktokd = 'Prospective Customer'.
append zstruct to zitab.
zstruct-zktokd = 'Competitor'.
append zstruct to zitab.
zstruct-zktokd = 'Sales partners'.
append zstruct to zitab.
zstruct-zktokd = 'Hierarchy Node'.
append zstruct to zitab.
zstruct-zktokd = 'Named List of Accounts'.
append zstruct to zitab.
zstruct-zktokd = 'Distribution center'.
append zstruct to zitab.
zstruct-zktokd = 'Payer'.
append zstruct to zitab.
handle1->bind_table( new_items = zitab ).
endmethod.
Please let me know if this is the best way to populate the node and then bind the table values from the node to the drop down box.
Thanks and Regards.

How do I get spry drop down menus to display infront of my content?

Hi,
I am currently using DW CS4 to create a website for a uni project. I have created a Spry Menu bar which displays correctly when I preview it however I have uploaded a few pages to my site to test them and the drop down menus disappear behind my content. Is there any way I can fix this?
My web address is www.nataliemiddlemore.110mb.com if you want to have a look. There is currently only 3 pages uploaded.
Also the drop down menus do accross the page horizontally rather than drop down underneath each other. Is there a way to fix this?
I would be very grateful for any help and am only a beginner so keep it as simple as possible for me.
Thankyou in advance.

You have used Absolutely Positioned Divs for your primary content. AP Divs are (by definition) taken out of the normal flow of the page. When they are in the code after the menus, they might show in front of them. I did not experience that on my system, however.
I don't see any overriding reason...beyond the thought that AP Divs are easy to make and place...for using AP Divs. Your page structure is very stable, and normal relatively-positioned Divs should work just fine.
As to the drop down menus trailing horizontally across the page, control the width of this: ul.MenuBarHorizontal ul to contain the left-floating list items. That style selector shows up in the SpryMenuBarHorizontal.css stylesheet. The submenus should then fall vertically.
Beth

Issue in value set Drop down for ALV in Webdynpro with Index

Hi Experts,
We are unable to get the Drop down values in the ALV Table as shown below.
Code:
   DATA lo_nd_table TYPE REF TO if_wd_context_node.
    DATA lt_table TYPE wd_this->elements_table.
   DATA ls_table TYPE wd_this->element_table.
   DATA: lr_input TYPE REF TO cl_salv_wd_uie_input_field,
         lr_column TYPE REF TO cl_salv_wd_column,
         lt_node_info TYPE wdr_context_attr_info_map,
         ls_node_info TYPE wdr_context_attribute_info,
         lr_dropdown TYPE REF TO cl_salv_wd_uie_dropdown_by_idx,
         lr_info TYPE REF TO if_wd_context_node_info.
   DATA:lt_columns TYPE salv_wd_t_column_ref,
         ls_columns TYPE salv_wd_s_column_ref,
         lv_tabix TYPE sy-tabix,
         lv_count TYPE c.
   DATA: ls_valueset TYPE wdr_context_attr_value,
         lt_valueset TYPE wdr_context_attr_value_list.
   TYPES:BEGIN OF ty_name,
   name TYPE string,
   END OF ty_name.
   DATA: lt_name TYPE TABLE OF ty_name,
   ls_name TYPE ty_name.
*   navigate from <CONTEXT> to <TABLE> via lead selection
   lo_nd_table = wd_context->get_child_node( name = wd_this->wdctx_table ).
   SELECT * FROM zemp_table INTO CORRESPONDING FIELDS OF TABLE lt_table UP TO 10 ROWS.
   LOOP AT lt_table INTO ls_table.
     lv_tabix = sy-tabix.
     CLEAR: ls_table-leave_values.
     DO 1 TIMES.
       lv_count = lv_count + 1.
       CONCATENATE 'Open' lv_count INTO ls_valueset-value.
       CONCATENATE 'Open' lv_count INTO ls_valueset-text.
       APPEND ls_valueset TO ls_table-leave_values.
       CLEAR ls_valueset.
       CONCATENATE 'Approved' lv_count INTO ls_valueset-value.
       CONCATENATE 'Approved' lv_count INTO ls_valueset-text.
       APPEND ls_valueset TO ls_table-leave_values.
       CLEAR ls_valueset.
       CONCATENATE 'Rejected' lv_count INTO ls_valueset-value.
       CONCATENATE 'Rejected' lv_count INTO ls_valueset-text.
       APPEND ls_valueset TO ls_table-leave_values.
       CLEAR ls_valueset.
     ENDDO.
     MODIFY lt_table FROM ls_table INDEX lv_tabix TRANSPORTING leave_status leave_values.
   ENDLOOP.
   DATA lo_cmp_usage TYPE REF TO if_wd_component_usage.
   lo_cmp_usage =   wd_this->wd_cpuse_alv( ).
   IF lo_cmp_usage->has_active_component( ) IS INITIAL.
     lo_cmp_usage->create_component( ).
   ENDIF.
   DATA lo_interfacecontroller TYPE REF TO iwci_salv_wd_table .
   lo_interfacecontroller =   wd_this->wd_cpifc_alv( ).
   DATA lo_value TYPE REF TO cl_salv_wd_config_table.
   lo_value = lo_interfacecontroller->get_model(
* lo_interfacecontroller->set_data( r_node_data = lo_nd_value_set ).
**Get the context node information
   lr_info = lo_nd_table->get_node_info( ).
   lt_node_info = lr_info->get_attributes( ).
   LOOP AT lt_node_info INTO ls_node_info.
     ls_name-name = ls_node_info-name.
     APPEND ls_name TO lt_name.
   ENDLOOP.
*Get all the columns to make row editable
   CALL METHOD lo_value->if_salv_wd_column_settings~get_columns
     RECEIVING
       value = lt_columns.
* Make the field dropdown
   CALL METHOD lo_value->if_salv_wd_column_settings~get_column
     EXPORTING
       id    = 'LEAVE_STATUS'
     RECEIVING
       value = lr_column.
* Create Object for dropdown
   CREATE OBJECT lr_dropdown
     EXPORTING
       selected_key_fieldname = 'LEAVE_STATUS'.
   CALL METHOD lr_dropdown->set_valueset_fieldname
     EXPORTING
       value = 'LEAVE_VALUES'.
   CALL METHOD lr_dropdown->set_type
     EXPORTING
       value = if_salv_wd_c_uie_drdn_by_index=>type_key_convert_to_value.
   CALL METHOD lr_column->set_cell_editor
     EXPORTING
       value = lr_dropdown.
*Set the table Editable
   lo_value->if_salv_wd_table_settings~set_read_only( value = abap_false ).
   lo_nd_table->bind_table( new_items = lt_table ).
Please suggest me where we are going wrong.
Thanks in advance...!!!
Best Regard's,
Shashi Kanth

Hi Shashi,
Your code looks okay. Debug & check if everything goes fine and all the required list of values getting bound to node.
Is any code after this logic, which sets data to table ? if so, that logic is wiping out the drop down list values from context node.
Final check point:
Read the context node 'TABLE' and fetch records into internal table in WDDOMODIFYVIEW( ) method to make sure that, every row of your table contains the drop down list entries in "LEAVE_VALUES" attribute
Hope this helps you.
Regards,
Rama

DW CS4 Horizontal Spry drop down menu not displaying correctly in Internet Explorer 8

Hi,
I have created a horizontal Spry drop down menu in Dreamweaver CS4 with my own background images. I have done various modifications to the CSS script to accommodate the style and feel needed; including making the main buttons' height twice the size of the sub menu buttons and some alignments. It seems to work different depending which browser is used.
It works well in Google Chrome.
It works well in Firefox with the exception that if any of the buttons are clicked, thereafter a thin black line is diplayed horizontally across center of the top main buttons when the mouse rolls over them. I would like to correct this but is not nearly as bad as the problem I'm having in Internet Explorer 8.
Here is my biggest concern and I would greatly appreciate if anyone can shed some light on this matter.
Once opened in Internet Explorer 8 the main navigation buttons appear as they should. IE8 prompts me the following: "To help protect your security, Internet Explorer has restricted this webpage from running scripts or ActiveX controls that could access your computer. Click here for options..". Once I allow IE8 to run scripts or ActiveX controls, the background image disappears and only shows on any menu or submenu button when the mouse rolls over that particular button. Can someone please help.
The menu can be seen at work by clicking on this link:
www.bargainxchange.com/BXC Main Navigation Spry Drop Menu.html
Below are all the scrips involved.
Here is the CSS script named "SpryMenuBarHorizontal4.css" in use :
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
    margin: 10;
    padding: 0;
    list-style-type: none;
    font-size: 80%;
    cursor: default;
    width: auto;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-align: center;
    /*whole menu moves*/
    margin-left: 100px;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
    z-index: 1000;
/* My Note --Top buttons' background, height and font size adjust-- */
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
    /* My note --I added the height and background-image as Main-Buttons.jpg-- */
    height: 55px;
    background-image: url(../Main-Buttons.jpg);
    margin: -2;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: center;
    /*text-align: left;*/
    cursor: pointer;
    width: 99px;
    float: left;
/* My note --Submenu font size adjust-- */
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
    /*height:38px;*/
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 87%;
    z-index: 1020;
    cursor: default;
    width: 160px;
    position: absolute;
    left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    /* My note --this margin alligns the drop buttons up and down-- */
    margin-top: 24px;
    height: 25px;
    left: auto;
/* My note --drop menu size adjustments-- */
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
    height: 25px;
    width: 160px;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
    position:absolute;
    margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
    /*border: 1px solid #CCC;*/
/* My note --Text Allignment global-- */
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
    /*height: 40px;*/
    text-align: center;
    /*vertical-align: center;*/
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    text-decoration: none;
    /*zzzzzzzz Text Color*/
    color: #333;        /*background-color: #CCC;*/
    letter-spacing: -0.00px;
    margin-left: 1px;
    margin-right: 0px;
    /*alligns text up or down globally*/
    margin-top: 1px;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    /*background-color: #33C;
    color: #FFF;*/
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    background-image: url(../Main-Buttons-mouse-over.jpg);    /*background-color: #33C;
    color: #FFF;*/
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* My note --mouse over-- */
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    background-repeat: no-repeat;
    background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
        display: inline;
        f\loat: left;
        background: #FFF;
Here is the JavaScrip file named "SpryMenuBar.js" that has not been modified in any way:
// SpryMenuBar.js - version 0.12 - Spry Pre-Release 1.6.1
// Copyright (c) 2006. Adobe Systems Incorporated.
// All rights reserved.
// Redistribution and use in source and binary forms, with or without
// modification, are permitted provided that the following conditions are met:
//   * Redistributions of source code must retain the above copyright notice,
//     this list of conditions and the following disclaimer.
//   * Redistributions in binary form must reproduce the above copyright notice,
//     this list of conditions and the following disclaimer in the documentation
//     and/or other materials provided with the distribution.
//   * Neither the name of Adobe Systems Incorporated nor the names of its
//     contributors may be used to endorse or promote products derived from this
//     software without specific prior written permission.
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
// AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
// IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
// ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
// LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
// CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
// SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
// CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
// ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
// POSSIBILITY OF SUCH DAMAGE.
SpryMenuBar.js
This file handles the JavaScript for Spry Menu Bar. You should have no need
to edit this file. Some highlights of the MenuBar object is that timers are
used to keep submenus from showing up until the user has hovered over the parent
menu item for some time, as well as a timer for when they leave a submenu to keep
showing that submenu until the timer fires.
var Spry; if (!Spry) Spry = {}; if (!Spry.Widget) Spry.Widget = {};
Spry.BrowserSniff = function()
    var b = navigator.appName.toString();
    var up = navigator.platform.toString();
    var ua = navigator.userAgent.toString();
    this.mozilla = this.ie = this.opera = this.safari = false;
    var re_opera = /Opera.([0-9\.]*)/i;
    var re_msie = /MSIE.([0-9\.]*)/i;
    var re_gecko = /gecko/i;
    var re_safari = /(applewebkit|safari)\/([\d\.]*)/i;
    var r = false;
    if ( (r = ua.match(re_opera))) {
        this.opera = true;
        this.version = parseFloat(r[1]);
    } else if ( (r = ua.match(re_msie))) {
        this.ie = true;
        this.version = parseFloat(r[1]);
    } else if ( (r = ua.match(re_safari))) {
        this.safari = true;
        this.version = parseFloat(r[2]);
    } else if (ua.match(re_gecko)) {
        var re_gecko_version = /rv:\s*([0-9\.]+)/i;
        r = ua.match(re_gecko_version);
        this.mozilla = true;
        this.version = parseFloat(r[1]);
    this.windows = this.mac = this.linux = false;
    this.Platform = ua.match(/windows/i) ? "windows" :
                    (ua.match(/linux/i) ? "linux" :
                    (ua.match(/mac/i) ? "mac" :
                    ua.match(/unix/i)? "unix" : "unknown"));
    this[this.Platform] = true;
    this.v = this.version;
    if (this.safari && this.mac && this.mozilla) {
        this.mozilla = false;
Spry.is = new Spry.BrowserSniff();
// Constructor for Menu Bar
// element should be an ID of an unordered list (<ul> tag)
// preloadImage1 and preloadImage2 are images for the rollover state of a menu
Spry.Widget.MenuBar = function(element, opts)
    this.init(element, opts);
Spry.Widget.MenuBar.prototype.init = function(element, opts)
    this.element = this.getElement(element);
    // represents the current (sub)menu we are operating on
    this.currMenu = null;
    this.showDelay = 250;
    this.hideDelay = 600;
    if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (Spry.is.ie && typeof document.uniqueID == 'undefined'))
        // bail on older unsupported browsers
        return;
    // Fix IE6 CSS images flicker
    if (Spry.is.ie && Spry.is.version < 7){
        try {
            document.execCommand("BackgroundImageCache", false, true);
        } catch(err) {}
    this.upKeyCode = Spry.Widget.MenuBar.KEY_UP;
    this.downKeyCode = Spry.Widget.MenuBar.KEY_DOWN;
    this.leftKeyCode = Spry.Widget.MenuBar.KEY_LEFT;
    this.rightKeyCode = Spry.Widget.MenuBar.KEY_RIGHT;
    this.escKeyCode = Spry.Widget.MenuBar.KEY_ESC;
    this.hoverClass = 'MenuBarItemHover';
    this.subHoverClass = 'MenuBarItemSubmenuHover';
    this.subVisibleClass ='MenuBarSubmenuVisible';
    this.hasSubClass = 'MenuBarItemSubmenu';
    this.activeClass = 'MenuBarActive';
    this.isieClass = 'MenuBarItemIE';
    this.verticalClass = 'MenuBarVertical';
    this.horizontalClass = 'MenuBarHorizontal';
    this.enableKeyboardNavigation = true;
    this.hasFocus = false;
    // load hover images now
    if(opts)
        for(var k in opts)
            if (typeof this[k] == 'undefined')
                var rollover = new Image;
                rollover.src = opts[k];
        Spry.Widget.MenuBar.setOptions(this, opts);
    // safari doesn't support tabindex
    if (Spry.is.safari)
        this.enableKeyboardNavigation = false;
    if(this.element)
        this.currMenu = this.element;
        var items = this.element.getElementsByTagName('li');
        for(var i=0; i<items.length; i++)
            if (i > 0 && this.enableKeyboardNavigation)
                items[i].getElementsByTagName('a')[0].tabIndex='-1';
            this.initialize(items[i], element);
            if(Spry.is.ie)
                this.addClassName(items[i], this.isieClass);
                items[i].style.position = "static";
        if (this.enableKeyboardNavigation)
            var self = this;
            this.addEventListener(document, 'keydown', function(e){self.keyDown(e); }, false);
        if(Spry.is.ie)
            if(this.hasClassName(this.element, this.verticalClass))
                this.element.style.position = "relative";
            var linkitems = this.element.getElementsByTagName('a');
            for(var i=0; i<linkitems.length; i++)
                linkitems[i].style.position = "relative";
Spry.Widget.MenuBar.KEY_ESC = 27;
Spry.Widget.MenuBar.KEY_UP = 38;
Spry.Widget.MenuBar.KEY_DOWN = 40;
Spry.Widget.MenuBar.KEY_LEFT = 37;
Spry.Widget.MenuBar.KEY_RIGHT = 39;
Spry.Widget.MenuBar.prototype.getElement = function(ele)
    if (ele && typeof ele == "string")
        return document.getElementById(ele);
    return ele;
Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
    if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
        return false;
    return true;
Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
    if (!ele || !className || this.hasClassName(ele, className))
        return;
    ele.className += (ele.className ? " " : "") + className;
Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
    if (!ele || !className || !this.hasClassName(ele, className))
        return;
    ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
// addEventListener for Menu Bar
// attach an event to a tag without creating obtrusive HTML code
Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
    try
        if (element.addEventListener)
            element.addEventListener(eventType, handler, capture);
        else if (element.attachEvent)
            element.attachEvent('on' + eventType, handler);
    catch (e) {}
// createIframeLayer for Menu Bar
// creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
    var layer = document.createElement('iframe');
    layer.tabIndex = '-1';
    layer.src = 'javascript:""';
    layer.frameBorder = '0';
    layer.scrolling = 'no';
    menu.parentNode.appendChild(layer);
    layer.style.left = menu.offsetLeft + 'px';
    layer.style.top = menu.offsetTop + 'px';
    layer.style.width = menu.offsetWidth + 'px';
    layer.style.height = menu.offsetHeight + 'px';
// removeIframeLayer for Menu Bar
// removes an IFRAME underneath a menu to reveal any form controls and ActiveX
Spry.Widget.MenuBar.prototype.removeIframeLayer = function(menu)
    var layers = ((menu == this.element) ? menu : menu.parentNode).getElementsByTagName('iframe');
    while(layers.length > 0)
        layers[0].parentNode.removeChild(layers[0]);
// clearMenus for Menu Bar
// root is the top level unordered list (<ul> tag)
Spry.Widget.MenuBar.prototype.clearMenus = function(root)
    var menus = root.getElementsByTagName('ul');
    for(var i=0; i<menus.length; i++)
        this.hideSubmenu(menus[i]);
    this.removeClassName(this.element, this.activeClass);
// bubbledTextEvent for Menu Bar
// identify bubbled up text events in Safari so we can ignore them
Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
    return Spry.is.safari && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget));
// showSubmenu for Menu Bar
// set the proper CSS class on this menu to show it
Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)
    if(this.currMenu)
        this.clearMenus(this.currMenu);
        this.currMenu = null;
    if(menu)
        this.addClassName(menu, this.subVisibleClass);
        if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
            if(!this.hasClassName(this.element, this.horizontalClass) || menu.parentNode.parentNode != this.element)
                menu.style.top = menu.parentNode.offsetTop + 'px';
        if(Spry.is.ie && Spry.is.version < 7)
            this.createIframeLayer(menu);
    this.addClassName(this.element, this.activeClass);
// hideSubmenu for Menu Bar
// remove the proper CSS class on this menu to hide it
Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)
    if(menu)
        this.removeClassName(menu, this.subVisibleClass);
        if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
            menu.style.top = '';
            menu.style.left = '';
        if(Spry.is.ie && Spry.is.version < 7)
            this.removeIframeLayer(menu);
// initialize for Menu Bar
// create event listeners for the Menu Bar widget so we can properly
// show and hide submenus
Spry.Widget.MenuBar.prototype.initialize = function(listitem, element)
    var opentime, closetime;
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    if(menu)
        this.addClassName(link, this.hasSubClass);
    if(!Spry.is.ie)
        // define a simple function that comes standard in IE to determine
        // if a node is within another node
        listitem.contains = function(testNode)
            // this refers to the list item
            if(testNode == null)
                return false;
            if(testNode == this)
                return true;
            else
                return this.contains(testNode.parentNode);
    // need to save this for scope further down
    var self = this;
    this.addEventListener(listitem, 'mouseover', function(e){self.mouseOver(listitem, e);}, false);
    this.addEventListener(listitem, 'mouseout', function(e){if (self.enableKeyboardNavigation) self.clearSelection(); self.mouseOut(listitem, e);}, false);
    if (this.enableKeyboardNavigation)
        this.addEventListener(link, 'blur', function(e){self.onBlur(listitem);}, false);
        this.addEventListener(link, 'focus', function(e){self.keyFocus(listitem, e);}, false);
Spry.Widget.MenuBar.prototype.keyFocus = function (listitem, e)
    this.lastOpen = listitem.getElementsByTagName('a')[0];
    this.addClassName(this.lastOpen, listitem.getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
    this.hasFocus = true;
Spry.Widget.MenuBar.prototype.onBlur = function (listitem)
    this.clearSelection(listitem);
Spry.Widget.MenuBar.prototype.clearSelection = function(el){
    //search any intersection with the current open element
    if (!this.lastOpen)
        return;
    if (el)
        el = el.getElementsByTagName('a')[0];
        // check children
        var item = this.lastOpen;
        while (item != this.element)
            var tmp = el;
            while (tmp != this.element)
                if (tmp == item)
                    return;
                try{
                    tmp = tmp.parentNode;
                }catch(err){break;}
            item = item.parentNode;
    var item = this.lastOpen;
    while (item != this.element)
        this.hideSubmenu(item.parentNode);
        var link = item.getElementsByTagName('a')[0];
        this.removeClassName(link, this.hoverClass);
        this.removeClassName(link, this.subHoverClass);
        item = item.parentNode;
    this.lastOpen = false;
Spry.Widget.MenuBar.prototype.keyDown = function (e)
    if (!this.hasFocus)
        return;
    if (!this.lastOpen)
        this.hasFocus = false;
        return;
    var e = e|| event;
    var listitem = this.lastOpen.parentNode;
    var link = this.lastOpen;
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    var opts = [listitem, menu, null, this.getSibling(listitem, 'previousSibling'), this.getSibling(listitem, 'nextSibling')];
    if (!opts[3])
        opts[2] = (listitem.parentNode.parentNode.nodeName.toLowerCase() == 'li')?listitem.parentNode.parentNode:null;
    var found = 0;
    switch (e.keyCode){
        case this.upKeyCode:
            found = this.getElementForKey(opts, 'y', 1);
            break;
        case this.downKeyCode:
            found = this.getElementForKey(opts, 'y', -1);
            break;
        case this.leftKeyCode:
            found = this.getElementForKey(opts, 'x', 1);
            break;
        case this.rightKeyCode:
            found = this.getElementForKey(opts, 'x', -1);
            break;
        case this.escKeyCode:
        case 9:
            this.clearSelection();
            this.hasFocus = false;
        default: return;
    switch (found)
        case 0: return;
        case 1:
            //subopts
            this.mouseOver(listitem, e);
            break;
        case 2:
            //parent
            this.mouseOut(opts[2], e);
            break;
        case 3:
        case 4:
            // left - right
            this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
            break;
    var link = opts[found].getElementsByTagName('a')[0];
    if (opts[found].nodeName.toLowerCase() == 'ul')
        opts[found] = opts[found].getElementsByTagName('li')[0];
    this.addClassName(link, opts[found].getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
    this.lastOpen = link;
    opts[found].getElementsByTagName('a')[0].focus();
        //stop further event handling by the browser
    return Spry.Widget.MenuBar.stopPropagation(e);
Spry.Widget.MenuBar.prototype.mouseOver = function (listitem, e)
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    if (this.enableKeyboardNavigation)
        this.clearSelection(listitem);
    if(this.bubbledTextEvent())
        // ignore bubbled text events
        return;
    if (listitem.closetime)
        clearTimeout(listitem.closetime);
    if(this.currMenu == listitem)
        this.currMenu = null;
    // move the focus too
    if (this.hasFocus)
        link.focus();
    // show menu highlighting
    this.addClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
    this.lastOpen = link;
    if(menu && !this.hasClassName(menu, this.subHoverClass))
        var self = this;
        listitem.opentime = window.setTimeout(function(){self.showSubmenu(menu);}, this.showDelay);
Spry.Widget.MenuBar.prototype.mouseOut = function (listitem, e)
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    if(this.bubbledTextEvent())
        // ignore bubbled text events
        return;
    var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
    if(!listitem.contains(related))
        if (listitem.opentime)
            clearTimeout(listitem.opentime);
        this.currMenu = listitem;
        // remove menu highlighting
        this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
        if(menu)
            var self = this;
            listitem.closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, this.hideDelay);
        if (this.hasFocus)
            link.blur();
Spry.Widget.MenuBar.prototype.getSibling = function(element, sibling)
    var child = element[sibling];
    while (child && child.nodeName.toLowerCase() !='li')
        child = child[sibling];
    return child;
Spry.Widget.MenuBar.prototype.getElementForKey = function(els, prop, dir)
    var found = 0;
    var rect = Spry.Widget.MenuBar.getPosition;
    var ref = rect(els[found]);
    var hideSubmenu = false;
    //make the subelement visible to compute the position
    if (els[1] && !this.hasClassName(els[1], this.MenuBarSubmenuVisible))
        els[1].style.visibility = 'hidden';
        this.showSubmenu(els[1]);
        hideSubmenu = true;
    var isVert = this.hasClassName(this.element, this.verticalClass);
    var hasParent = els[0].parentNode.parentNode.nodeName.toLowerCase() == 'li' ? true : false;
    for (var i = 1; i < els.length; i++){
        //when navigating on the y axis in vertical menus, ignore children and parents
        if(prop=='y' && isVert && (i==1 || i==2))
            continue;
        //when navigationg on the x axis in the FIRST LEVEL of horizontal menus, ignore children and parents
        if(prop=='x' && !isVert && !hasParent && (i==1 || i==2))
            continue;
        if (els[i])
            var tmp = rect(els[i]);
            if ( (dir * tmp[prop]) < (dir * ref[prop]))
                ref = tmp;
                found = i;
    // hide back the submenu
    if (els[1] && hideSubmenu){
        this.hideSubmenu(els[1]);
        els[1].style.visibility = '';
    return found;
Spry.Widget.MenuBar.camelize = function(str)
    if (str.indexOf('-') == -1){
        return str;
    var oStringList = str.split('-');
    var isFirstEntry = true;
    var camelizedString = '';
    for(var i=0; i < oStringList.length; i++)
        if(oStringList[i].length>0)
            if(isFirstEntry)
                camelizedString = oStringList[i];
                isFirstEntry = false;
            else
                var s = oStringList[i];
                camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
    return camelizedString;
Spry.Widget.MenuBar.getStyleProp = function(element, prop)
    var value;
    try
        if (element.style)
            value = element.style[Spry.Widget.MenuBar.camelize(prop)];
        if (!value)
            if (document.defaultView && document.defaultView.getComputedStyle)
                var css = document.defaultView.getComputedStyle(element, null);
                value = css ? css.getPropertyValue(prop) : null;
            else if (element.currentStyle)
                    value = element.currentStyle[Spry.Widget.MenuBar.camelize(prop)];
    catch (e) {}
    return value == 'auto' ? null : value;
Spry.Widget.MenuBar.getIntProp = function(element, prop)
    var a = parseInt(Spry.Widget.MenuBar.getStyleProp(element, prop),10);
    if (isNaN(a))
        return 0;
    return a;
Spry.Widget.MenuBar.getPosition = function(el, doc)
    doc = doc || document;
    if (typeof(el) == 'string') {
        el = doc.getElementById(el);
    if (!el) {
        return false;
    if (el.parentNode === null || Spry.Widget.MenuBar.getStyleProp(el, 'display') == 'none') {
        //element must be visible to have a box
        return false;
    var ret = {x:0, y:0};
    var parent = null;
    var box;
    if (el.getBoundingClientRect) { // IE
        box = el.getBoundingClientRect();
        var scrollTop = doc.documentElement.scrollTop || doc.body.scrollTop;
        var scrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft;
        ret.x = box.left + scrollLeft;
        ret.y = box.top + scrollTop;
    } else if (doc.getBoxObjectFor) { // gecko
        box = doc.getBoxObjectFor(el);
        ret.x = box.x;
        ret.y = box.y;
    } else { // safari/opera
        ret.x = el.offsetLeft;
        ret.y = el.offsetTop;
        parent = el.offsetParent;
        if (parent != el) {
            while (parent) {
                ret.x += parent.offsetLeft;
                ret.y += parent.offsetTop;
                parent = parent.offsetParent;
        // opera & (safari absolute) incorrectly account for body offsetTop
        if (Spry.is.opera || Spry.is.safari && Spry.Widget.MenuBar.getStyleProp(el, 'position') == 'absolute')
            ret.y -= doc.body.offsetTop;
    if (el.parentNode)
            parent = el.parentNode;
    else
        parent = null;
    if (parent.nodeName){
        var cas = parent.nodeName.toUpperCase();
        while (parent && cas != 'BODY' && cas != 'HTML') {
            cas = parent.nodeName.toUpperCase();
            ret.x -= parent.scrollLeft;
            ret.y -= parent.scrollTop;
            if (parent.parentNode)
                parent = parent.parentNode;
            else
                parent = null;
    return ret;
Spry.Widget.MenuBar.stopPropagation = function(ev)
    if (ev.stopPropagation)
        ev.stopPropagation();
    else
        ev.cancelBubble = true;
    if (ev.preventDefault)
        ev.preventDefault();
    else
        ev.returnValue = false;
Spry.Widget.MenuBar.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
    if (!optionsObj)
        return;
    for (var optionName in optionsObj)
        if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
            continue;
        obj[optionName] = optionsObj[optionName];
And last, here is the HTML code that has also not been modified in any way:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="../BXC Main Navigation Spry Drop Menu/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../BXC Main Navigation Spry Drop Menu/SpryAssets/SpryMenuBarHorizontal4.css" rel="stylesheet" type="text/css" />
</head>
<body>
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="#">Buy</a>
    <ul>
      <li><a href="#">Shop from Private Owner</a></li>
      <li><a href="#">Shop Direct from Stores</a></li>
      <li><a href="#">Help Buying</a></li>
    </ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Bid</a>
    <ul>
      <li><a href="#">Shop from Auction</a></li>
      <li><a href="#">Help Bidding</a></li>
    </ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Trade</a>
    <ul>
      <li><a href="#">Shop for Trades</a></li>
      <li><a href="#">Help Trading</a></li>
    </ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">List Items</a>
    <ul>
      <li><a href="#">List Items in Auction</a></li>
      <li><a href="#">List Items for Sale</a></li>
      <li><a href="#">List Items for Trade</a></li>
      <li><a href="#">Help Listing Items</a></li>
    </ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Intro</a>
    <ul>
      <li><a href="#">Flash Site &amp; Intro</a></li>
      <li><a href="#">About Us</a></li>
    </ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">My Xchange</a>
    <ul>
      <li><a href="#">Activity</a></li>
      <li><a href="#">Account</a></li>
      <li><a href="#">Mail</a></li>
    </ul>
</li>
<li><a href="#">Contact Us</a></li>
<li><a href="#" class="MenuBarItemSubmenu">Help</a>
    <ul>
      <li><a href="#">Main Help</a></li>
      <li><a href="#">Site Map</a></li>
    </ul>
</li>
</ul>
<script type="text/javascript">

</script>
</body>
</html>
Thanks in advance for any of your help.
Jose H.

Hello Nancy,
I was troubleshooting For the next 8 hours after my post here and eventually I got it right, I uploaded the files to the test server and at the time did not have the chance to post the solution here. This is why, as you saw, it is working correctly now. Both the CSS and HTML files needed modifications. While working on the code I had to run IE8, Chrome and Firefox simultaneously and refresh all three after every change in the code because what would fix the problem in one would cause a problem for the other.
In addition to the problems listed in my original post, there were also other graphical issues in IE8, such as; the main menu buttons without sub-menus would only display at half their size vertically. The border around the buttons would not display despite that the background images were rendered in Photoshop as flattened JPEGs with boarders as part of the background image. Being so, I removed all borders from the CSS script.
By the way.. the IE8 security measure did pop up while working from the server.
Anyhow for those of you who are experiencing similar problems you can take a look at the working code bellow and compare it to the initial code. I've included detail comments on every line I have changed, modified or added.
Good luck.. as I know it can become a complicated task when creating custom Spry menus.
<b>Here is the finished CSS script</b>
<code>@charset "UTF-8";
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
    margin: 10;
    padding: 0;
    list-style-type: none;
    /* font size for top menu*/
    font-size: 80%;
    cursor: default;
    width: auto;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-align: center;
    /*whole menu moves*/
    margin-left: 100px;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
    z-index: 1000;
/* My Note --Top buttons' background, height and font size adjust-- */
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
    /* My note --I added the height and background-image as Main-Buttons.jpg-- */
    height: 55px;
    background-image: url(../Main-Buttons.jpg);
    margin: -2;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: center;
    /*text-align: left;*/
    cursor: pointer;
    width: 99px;
    float: left;
/* My note --Submenu font size adjust-- */
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 87%;
    z-index: 1020;
    cursor: default;
    width: 160px;
    position: absolute;
    left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    /* My note --this margin alligns the drop buttons up and down-- */
    margin-top: 0px;
    height: 25px;
    left: auto;
/* My note --drop menu size adjustments-- */
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
    height: 25px;
    width: 162px;
    /* New addition */
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
    position:absolute;
    margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
    /*border: 1px solid #CCC;*/
/* My note --Text Allignment global-- */
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
    /*My note -- took out borders & changed text color to #333(black)& added my own mouse not over image-- */
    /*border: 0px solid #333332;*/
    background-image: url(../Main-Buttons.jpg);
    /*height: 40px;*/
    text-align: center;
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    text-decoration: none;
    /*My note --Text Color-- */
    color: #333;        /*background-color: was #CCC;*/
    letter-spacing: -0.00px;
    margin-left: 1px;
    margin-right: 0px;
    /*alligns text up or down globally*/
    margin-top: 1px;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    /* My note --took out all backgound & text color for mouse over-- */
    /*background-color: #33C;
    color: #FFF;*/
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    /*My note -- took out background & text & added my own mouse over image-- */
    background-image: url(../Main-Buttons-mouse-over.jpg);
    /*background-color: #33C;
    color: #FFF;*/
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
    /* My note --!!!!!This height setting adjusts the main buttons' background height in IE8!!!!-- */
    height: 40px;
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* My note --mouse over-- */
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    background-repeat: no-repeat;
    background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
        display: inline;
        f\loat: left;
        /* My note --The backgound color below was changed here to the same color #3e6487 as the darkest tone in the background image graphic to mimic the original image borders; dark blue, since IE8 for some reason would cut them out. This change allows this dark blue background to display around the main top buttons in IE8 giving the appearance of borders*/
        background: #3e6487;
</code>
<b>Here is the modified HTML script</b>
<code><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="/SpryAssets/SpryMenuBarHorizontal4.css" rel="stylesheet" type="text/css" />
</head>
<body>
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="#">Buy</a>
    <ul>
      <li><a href="#">Shop from Private Owner</a></li>
      <li><a href="#">Shop Direct from Stores</a></li>
      <li><a href="#">Help Buying</a></li>
    </ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Bid</a>
    <ul>
      <li><a href="#">Shop from Auction</a></li>
      <li><a href="#">Help Bidding</a></li>
    </ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Trade</a>
    <ul>
      <li><a href="#">Shop for Trades</a></li>
      <li><a href="#">Help Trading</a></li>
    </ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">List Items</a>
    <ul>
      <li><a href="#">List Items in Auction</a></li>
      <li><a href="#">List Items for Sale</a></li>
      <li><a href="#">List Items for Trade</a></li>
      <li><a href="#">Help Listing Items</a></li>
    </ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Intro</a>
    <ul>
      <li><a href="#">Flash Site &amp; Intro</a></li>
      <li><a href="#">About Us</a></li>
    </ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">My Xchange</a>
    <ul>
      <li><a href="#">Activity</a></li>
      <li><a href="#">Account</a></li>
      <li><a href="#">Mail</a></li>
    </ul>
</li>

<li><a href="#" class="MenuBarItemSubmenu">Contact Us</a>
<li><a href="#" class="MenuBarItemSubmenu">Help</a>
    <ul>
      <li><a href="#">Main Help</a></li>
      <li><a href="#">Site Map</a></li>
    </ul>
</li>
</ul>
<script type="text/javascript">

</script>
</body>
</html>
</code>
And Richard.. Thanks again for the time and your help, truly appreciated.
Jose H.

Drop down in ALV for Webdynpro ABAP

Hi Experts,
I was trying to implement one Web dynpro ABAP application that will show one ALV and ALV will content one dropdown so that user can select data from the drop down. Addtion to that, my dropdown should have data based on another column of ALV.
I have followed one article which is available in Net.
At the end of development, ALV is displayed with dropdown. Also dropdown has data binded. However, no data is visible in dropdown.
I have created one context node having four dictionary element and one elemt for dispplaying the dropdown.
In the DoInit method of view, i have written below code:
Data Declaration
DATA:
        lo_node_cskt TYPE REF TO if_wd_context_node,
        lo_el_cskt    TYPE REF TO if_wd_context_element,
        ls_cskt       TYPE wd_this->element_cskt,
        lt_cskt       TYPE wd_this->elements_cskt,
        lo_cmp_usage TYPE REF TO if_wd_component_usage,
        lv_value      TYPE REF TO cl_salv_wd_config_table,
        lr_column     TYPE REF TO cl_salv_wd_column,
        lr_drdn       TYPE REF TO cl_salv_wd_uie_dropdown_by_idx,
        ls_value_set TYPE wdr_context_attr_value,
        lv_tabix      TYPE sy-tabix,
        lv_count(2) TYPE c,
        lo_interfacecontroller TYPE REF TO iwci_salv_wd_table.
Navigate from <CONTEXT> to <CSKT> via lead selection:
lo_node_cskt = wd_context->get_child_node( name = wd_this->wdctx_cskt ).
get element via lead selection
lo_el_cskt = lo_node_cskt->get_element( ).
Get Data:
SELECT kokrs kostl datbi ktext FROM cskt INTO CORRESPONDING FIELDS OF TABLE lt_cskt.
lv_count = 0.
Populate value set
LOOP AT lt_cskt INTO ls_cskt.
    lv_tabix = sy-tabix.
    CLEAR ls_cskt-ktext.
    DO 3 TIMES.
      lv_count = lv_count + 1.
      CONCATENATE 'TEST' lv_count INTO ls_value_set-text.
      CONCATENATE 'TEST' lv_count INTO ls_value_set-value.
      if lv_tabix = 2.
       if sy-index = 2.
         EXIT.
       endif.
      endif.
      APPEND ls_value_set TO ls_cskt-valueset.
    ENDDO.
    MODIFY lt_cskt FROM ls_cskt INDEX lv_tabix TRANSPORTING ktext valueset.
ENDLOOP.
Bind data
lo_node_cskt->bind_table( lt_cskt ).
Instantiate ALV
lo_cmp_usage = wd_this->wd_cpuse_alv( ).
IF lo_cmp_usage->has_active_component( ) IS INITIAL.
    lo_cmp_usage->create_component( ).
ENDIF.
lo_interfacecontroller = wd_this->wd_cpifc_alv( ).
Bind Data to Interface Controller Node
   lo_interfacecontroller->set_data(
        r_node_data = lo_node_cskt
Get ALV reference table
   lv_value = lo_interfacecontroller->get_model( ).
Make KTEXT column as drop down
   CALL METHOD lv_value->if_salv_wd_column_settings~get_column
   EXPORTING
     id = 'KTEXT'
   RECEIVING
     value = lr_column.
Create Object for Drop down
CREATE OBJECT lr_drdn
   EXPORTING
     selected_key_fieldname = 'KTEXT'.
CALL METHOD lr_drdn->set_valueset_fieldname
EXPORTING
    value = 'VALUESET'.
CALL METHOD lr_drdn->set_type
EXPORTING
    value = IF_SALV_WD_C_UIE_DRDN_BY_INDEX=>TYPE_KEY_CONVERT_TO_VALUE.
CALL METHOD lr_column->set_cell_editor
EXPORTING
    value = lr_drdn.
CALL METHOD lv_value->if_salv_wd_table_settings~set_read_only
EXPORTING
    value = abap_false.
I am still finding the answer why data in drop down is not visible. However, I can select by clicking dropdown and blank elements (since data is not visible) can be selected.

Hey
i am using the same code except i have just modified little bit the select statement to restrict the number of entries.
and also besides writing the code in wddoinit i have added the compenent usage of alv component and added the node
having the structure ckst and after that deleting the dictionary reference to add the attribute valueset in both places
component controller and view controller and mapped them and mapped the data node of interface controller of comp
usage to this node in comp contrlr.
and adding the view container and embeding table view of alv comp there.
that's it
and here is the code which is almost same as yours except small change in select statement.
method WDDOINIT .
DATA:
lo_node_cskt TYPE REF TO if_wd_context_node,
lo_el_cskt TYPE REF TO if_wd_context_element,
ls_cskt TYPE wd_this->element_cskt,
lt_cskt TYPE wd_this->elements_cskt,
lo_cmp_usage TYPE REF TO if_wd_component_usage,
lv_value TYPE REF TO cl_salv_wd_config_table,
lr_column TYPE REF TO cl_salv_wd_column,
lr_drdn TYPE REF TO cl_salv_wd_uie_dropdown_by_idx,
ls_value_set TYPE wdr_context_attr_value,
lv_tabix TYPE sy-tabix,
lv_count(2) TYPE c,
lo_interfacecontroller TYPE REF TO iwci_salv_wd_table.
* Navigate from <CONTEXT> to <CSKT> via lead selection:
lo_node_cskt = wd_context->get_child_node( name = wd_this->wdctx_cskt ).
* get element via lead selection
lo_el_cskt = lo_node_cskt->get_element( ).
* Get Data:
SELECT kokrs kostl datbi ktext FROM cskt INTO CORRESPONDING FIELDS OF TABLE lt_cskt up to 10 rows .
lv_count = 0.
* Populate value set
LOOP AT lt_cskt INTO ls_cskt.
lv_tabix = sy-tabix.
CLEAR ls_cskt-ktext.
DO 3 TIMES.
lv_count = lv_count + 1.
CONCATENATE 'TEST' lv_count INTO ls_value_set-text.
CONCATENATE 'TEST' lv_count INTO ls_value_set-value.
if lv_tabix = 2.
if sy-index = 2.
EXIT.
endif.
endif.
APPEND ls_value_set TO ls_cskt-valueset.
ENDDO.
MODIFY lt_cskt FROM ls_cskt INDEX lv_tabix TRANSPORTING ktext valueset.
ENDLOOP.
* Bind data
lo_node_cskt->bind_table( lt_cskt ).
* Instantiate ALV
lo_cmp_usage = wd_this->wd_cpuse_alv( ).
IF lo_cmp_usage->has_active_component( ) IS INITIAL.
lo_cmp_usage->create_component( ).
ENDIF.
lo_interfacecontroller = wd_this->wd_cpifc_alv( ).
* Bind Data to Interface Controller Node
lo_interfacecontroller->set_data(
r_node_data = lo_node_cskt
* Get ALV reference table
lv_value = lo_interfacecontroller->get_model( ).
* Make KTEXT column as drop down
CALL METHOD lv_value->if_salv_wd_column_settings~get_column
EXPORTING
id = 'KTEXT'
RECEIVING
value = lr_column.
* Create Object for Drop down
CREATE OBJECT lr_drdn
EXPORTING
selected_key_fieldname = 'KTEXT'.
CALL METHOD lr_drdn->set_valueset_fieldname
EXPORTING
value = 'VALUESET'.
CALL METHOD lr_drdn->set_type
EXPORTING
value = IF_SALV_WD_C_UIE_DRDN_BY_INDEX=>TYPE_KEY_CONVERT_TO_VALUE.
CALL METHOD lr_column->set_cell_editor
EXPORTING
value = lr_drdn.
CALL METHOD lv_value->if_salv_wd_table_settings~set_read_only
EXPORTING
value = abap_false.
endmethod.
thanks
sarbjeet

Drop-downs in ALV: display list of code & value

Similar Messages

Maybe you are looking for