2 column definitions for a single table view

Question

Hi Experts,
I have a requirement in which i need 2 column definitions for a single table view.
The requirement is :
..............Week1...........              |....................Week2...............
01/01/2007 |  02/01/2007  |    15/01/2007 | 16/01/2007 | 17/01/2007
data.......... |  data..........  |    data.......... | data..........  |   data..........      
data.......... |  data..........  |    data.......... | data..........  |   data..........    
data.......... |  data..........  |    data.......... | data..........  |   data..........   
the weeks shud be displayed for the corresponing dates below......
Is it possible to have 2 column definitions
Please help me out.
Thanks in advance

Answer 1

Hi Balaiji,
proceed as follows:
Create a structure in the dictionary called ZSTRU_USR02_F
  with  field1 type int4
          field3 type int4
          field3 type int4
Create a table type in the dictionary:
zusr02  line type ZSTRU_USR02_F.
Create a structure in the dictionary:
ZSTRU_USR02
  with tab1  type zusr02
  and tab2  type zusr02
Create a table type in the dictionary:
zttusr02 line type ZSTRU_USR02
Create a controller (table.do) in a BSP-application
Add the controller class to this controller.
Add a attribute (table) instance public type zttusr02
redefine method do_request, add the following coding:
  FIELD-SYMBOLS: <fs_tab> LIKE LINE OF table,
                 <fs_row> TYPE zstru_usr02_f.
  DATA: lirv_view TYPE REF TO if_bsp_page,
        lv_int    TYPE i.
* Dispatch Input for event handling
  dispatch_input( ).
* Navigation requested during Event handling?
  IF is_navigation_requested( ) IS NOT INITIAL.
    RETURN.
  ENDIF.
* get some data into the table.
  INSERT INITIAL LINE INTO TABLE table ASSIGNING <fs_tab>.
  DO 3 TIMES.
    INSERT INITIAL LINE INTO TABLE <fs_tab>-tab1 ASSIGNING <fs_row>.
    ADD 1 TO lv_int.
    <fs_row>-field1 = lv_int.
    ADD 1 TO lv_int.
    <fs_row>-field2 = lv_int.
    ADD 1 TO lv_int.
    <fs_row>-field3 = lv_int.
  ENDDO.
  DO 3 TIMES.
    INSERT INITIAL LINE INTO TABLE <fs_tab>-tab2 ASSIGNING <fs_row>.
    ADD 1 TO lv_int.
    <fs_row>-field1 = lv_int.
    ADD 1 TO lv_int.
    <fs_row>-field2 = lv_int.
    ADD 1 TO lv_int.
    <fs_row>-field3 = lv_int.
  ENDDO.
* Create the view
  lirv_view ?= create_view( view_name = 'table.htm' ).
* Hand over the data
  lirv_view->set_attribute( name = 'table' value = table ).
* Call the view
  call_view( lirv_view ).
Create a view called table.htm. Add your controller class as controller class for the view and add the attribute table type zttusr02.
Add the following to the layout:
<%@page language="abap"%>
<%@extension name="htmlb" prefix="htmlb"%>
<htmlb:content design="design2003">
  <htmlb:page title = " ">
    <htmlb:form>
<htmlb:tableView id             = "tableToDisplay"
                 table          = "<%=table%>"
                 emptyTableText = "No Data"
                 iterator       = "<%=controller%>"
                 footerVisible  = "FALSE"
                 encode         = "TRUE"
                 width          = "100%"/>
    </htmlb:form>
  </htmlb:page>
</htmlb:content>
Go back to your controller class. Add the interface IF_HTMLB_TABLEVIEW_ITERATOR
Implement the method IF_HTMLB_TABLEVIEW_ITERATOR~GET_COLUMN_DEFINITIONS
  DATA: lwa_column  LIKE LINE OF p_column_definitions.
* Column 1
  CLEAR lwa_column.
  lwa_column-columnname          = 'TAB1'.
  lwa_column-title               = 'Column 1'.
  lwa_column-tooltipheader       = 'Tooltip Column 1'.
  lwa_column-width               = '50%'.
  lwa_column-wrapping            = 'FALSE'.
  lwa_column-horizontalalignment = 'LEFT'.
  lwa_column-verticalalignment   = 'MIDDLE'.
  APPEND lwa_column TO p_column_definitions.
* Column 1
  CLEAR lwa_column.
  lwa_column-columnname          = 'TAB2'.
  lwa_column-title               = 'Column 2'.
  lwa_column-tooltipheader       = 'Tooltip Column 2'.
  lwa_column-width               = '50%'.
  lwa_column-wrapping            = 'FALSE'.
  lwa_column-horizontalalignment = 'LEFT'.
  lwa_column-verticalalignment   = 'MIDDLE'.
  APPEND lwa_column TO p_column_definitions.
Implement the method IF_HTMLB_TABLEVIEW_ITERATOR~RENDER_CELL_START and add:
  DATA: lr_tview   TYPE REF TO cl_htmlb_tableview.
  FIELD-SYMBOLS: <fs_row> LIKE LINE OF table.
  ASSIGN p_row_data_ref->* TO <fs_row>.
  CASE p_column_key.
    WHEN 'TAB1'.
      CREATE OBJECT lr_tview.
      lr_tview->id = p_cell_id.
      GET REFERENCE OF <fs_row>-tab1 INTO lr_tview->table.
      lr_tview->footervisible = ''.
      lr_tview->width = '100%'.
      p_replacement_bee = lr_tview.
    WHEN 'TAB2'.
      CREATE OBJECT lr_tview.
      lr_tview->id = p_cell_id.
      GET REFERENCE OF <fs_row>-tab2 INTO lr_tview->table.
      lr_tview->footervisible = ''.
      lr_tview->width = '100%'.
      p_replacement_bee = lr_tview.
  ENDCASE.
With this you get a table in a table. Now if you create a second iterator you'll be able to adjust the apperance of the inner table, as well as you can add column headers.
Hope that helps.
Best Regards
Michael