WDA学习：Component Usage(Select Options)

Posted 2020-12-08 tangtoms

1.6 Component Usage（Select Options）

       本实例如何使用Component组件SELECT_OPTIONS。在实际应用都是多个Web Dynpro Component组成的。可以直接在之前基础上操作，也可以新建一个项目。

1.Web Dynpro Component：Z_TEST_WDA2创建Component Use。

 

选择FLIGHTLISTVIEW视图组件，点击Create Controller Usage

 

选择Component Use为SELECT_OPTIONS的

 

 

 

 

 

 

 修改Context页签

创建FLIGHT上下文节点，

 

 

 

 

 

 修改Attributes页签

创建变量M_HANDLER，类型：IF_WD_SELECT_OPTIONS;

创建变量M_WD_SELECT_OPTIONS,类型：IWCI_WDR_SELECT_OPTIONS;

 

修改Layout页签

创建GROUP类型视图控件GROUP3；

创建ViewContianerUIElement类型视图控件，这个控件可以用来显示Compnent组件的视图View。这里用来显示SELECTION_OPTION。

 

 

 

 创建BUTTON按钮类型视图控件BTN1，点击按钮获取SELECTION_OPTION值，根据条件查询flight。Action：FIND,自动生成Method:ONACTIONFIND方法。

 

创建TABLE类型视图控件TABLE1，显示查询出来的flight信息。

右键TABLE1控件->Creat Binding

 

修改Methods页签，

重写WDDOINIT方法，初始化SELECT_OPTIONS。

method WDDOINIT .
  data:lt_range_table type ref to data,
        rt_range_table type ref to data,
        read_only      type abap_bool,
        typename       type string.

  data:lr_componentcontroller type ref to ig_componentcontroller,
       l_ref_cmp_usage type ref to if_wd_component_usage.

* create the used component
 l_ref_cmp_usage = wd_this->wd_cpuse_select_options( ).
 if l_ref_cmp_usage->has_active_component( ) is initial.
   l_ref_cmp_usage->create_component( ).
 endif.

* get a pointer to the interface controller of the select options *component
 wd_this->m_wd_select_options = wd_this->wd_cpifc_select_options( ).

* init the select screen
 wd_this->m_handler =  wd_this->m_wd_select_options->init_selection_screen( ).

* create a range table that consists of this new data element
 lt_range_table = wd_this->m_handler->create_range_table( i_typename = ‘S_CARR_ID‘ ).

* add a new field to the selection
 wd_this->m_handler->add_selection_field(
  i_id = ‘S_CARR_ID‘
  it_result = lt_range_table
  i_read_only = read_only ).

* create a range table that consists of this new data element
 lt_range_table = wd_this->m_handler->create_range_table( i_typename = ‘S_CONN_ID‘ ).

* add a new field to the selection
 wd_this->m_handler->add_selection_field( i_id = ‘S_CONN_ID‘
  it_result = lt_range_table
  i_read_only = read_only ).
endmethod.

View Code

重写ONACTIONFIND方法,通过获取SELECT_OPTIONS值，作为条件查询flight信息。

method ONACTIONFIND .
  data: node_flights   type ref to if_wd_context_node.
  data: rt_carrid type ref to data.
  data: rt_connid type ref to data.
  data: t_flight type table of sflight.
  field-symbols: <fs_carrid> type table,
                 <fs_connid> type table.

* Retrieve the data from the select option
  rt_carrid = wd_this->m_handler->get_range_table_of_sel_field(  i_id = ‘S_CARR_ID‘ ).
* Assign it to a field symbol
  assign rt_carrid->* to <fs_carrid>.

* Retrieve the data from the select option
  rt_connid = wd_this->m_handler->get_range_table_of_sel_field( i_id = ‘S_CONN_ID‘ ).
* Assign it to a field symbol
  assign rt_connid->* to <fs_connid>.

* Retrieve that data from the database.  Normally it is suggested to
* encapsulate the data retrieval in a separate class.
* For simplicity, the SELECT statement has been implemented here.
  select * into corresponding fields of table t_flight from sflight
    where carrid in <fs_carrid>
    and connid in <fs_connid>.

* Bind the data to the context
  node_flights = wd_context->get_child_node( name = `FLIGHT` ).
  node_flights->bind_elements( t_flight ).

endmethod.

View Code

2．设置Window，将SELECTION_OPTION组件视图放入VIEW1

 

选择点击F4帮助小方块，找到SELECT_OPTIONS的VIEW屏幕

 

 

 

3.运行Web Dynpro Application，使用Selection options,点击find按钮。