1、Simple BSP application to CreateSimple BSP application to Create, Modify and Delete the database entriesBefore building a BSP application, youll have to have database table. STEP 1: Call transaction SE11; create a database table using predefined types.STEP 2: Push some entries in the table;Enter a b
2、unch of employee-ids, corresponding date-of-birth, date-of-joining and salary.STEP 3: Call transaction SE80; create a BSP application. STEP 4: Right-click the object name and create a page with flow-logic. STEP 5: Choose the Type Definitions tab and create a type-definition.STEP 6: Choose the tab Pa
3、ge Attributes and define the work variables, which you are going to use in your application. Besides defining work-variables, you have to define an internal table and a field string.To define a field-string, use types: ff_progmr. And to define an internal table, use table-type of ZART_PROGRAMMER tab
4、le. Open table using SE11, press Ctrl+Shift+F3 (Where-Used-List), or click the icon , deselect other checkboxes and select Table-Types, purse down the table-type name for the table ZART_PROGRAMMER.Or create a new table-type, if there exists no table-type. Call transaction SE11-Data type-Create-Table
5、 Type-Line Type: ZART_PROGRAMMER-Save and Activate. fl_flag TYPE INT4fs_progmr TYPE FF_PROGMRt_progmr TYPE ZART_TTw_dob TYPE DATSw_doj TYPE DATSw_emno TYPE ZART_PROGRAMMER-EMNOw_ext_dob TYPE CHAR10w_ext_doj TYPE CHAR10w_index TYPE INT4w_salary TYPE ZART_PROGRAMMER-SALARYSTEP 7: Choose the tab Layout
6、 and design a web-page that should contain a table-view and table-view-columns. Table-View chooses the internal table from which the data has to be fetched and displays it in formatted manner. Table-View-Column.To get a table-view, choose Tag-Browser from the left-hand pane; pull down BSP Extensions
7、-Transportable-HTMLB. Here you get a lot of htmlb controls, drag Table-View control and drop it in the layout (For additional details about it, right-click the tag and go through documentation). When you activate this page and choice to view the output, it cant happen since internal table contains n
8、o data. STEP 8: To populate data in internal table, choose Event Handler tab and select OnInitialization, this event is triggered no sooner the page gets refreshed or called for the first time.OnInitialization: SELECT*FROMzart_programmerINTOTABLEt_progmr. Save, activate and test the page: Selection-
9、Mode for the table-view has been defined as SINGLESELECT, this selects desired row. Now, we need Selected-Row-Index, which eases our task to play around with any kind of manipulation we desire.STEP 8: Choose tab Event Handler and select OnInputProcessing. OnInputProcessing handlesthe events forcheck
10、ingandprocessinguserinputand fordefiningnavigation.Code the following in OnInputProcessing event;DATA:w_eventTYPEREFTOcl_htmlb_event,w_eventidTYPEstring,w_objectTYPEREFTOobject,w_fieldidTYPEstring,w_in_fieldTYPEREFTOcl_htmlb_inputfield,w_in_valueTYPEstring,w_employeeTYPEzart_programmer-emno,w_dofbTY
11、PEchar10,w_dofjTYPEchar10,w_esalaryTYPEzart_programmer-salary.CALLMETHODcl_htmlb_manager=get_eventEXPORTINGrequest=runtime-server-request*fast_exit_event_id=*fast_exit_event_class=RECEIVINGevent=w_event.w_eventid=w_event-id.IFw_eventidEQProgrammer_Data.CLASScl_htmlb_managerDEFINITIONLOAD.CASEevent_i
12、d.WHENcl_htmlb_manager=event_id.DATA:eventTYPEREFTOif_htmlb_data,selrowTYPEREFTOcl_htmlb_tableview.event=cl_htmlb_manager=get_event_ex(request).selrow?=cl_htmlb_manager=get_data(request=requestname=tableViewid=Programmer_Data).DATA:tv_dataTYPEREFTOcl_htmlb_event_tableview.tv_data=selrow-data.w_index
13、=tv_data-selectedrowindex. ENDCASE. w_eventid contains the id of button, table-view, etc.w_index contains selected-row-index value. To catch the event, we make use of Class cl_htmlb_manager and method get_event. Similarly, to catch data from input-fields, get_data method is used. STEP 10: On the cli
14、ck of create button, we set the fl_flag as 2, that can be used to display create layout with an insert button on the same page. Further, on click of insert button, values of all input fields are processed and inserted into database using a simple INSERT query.Add the following code in OnInputProcessing; ELSEIFw_eventidEQcreate.fl_flag=2. Now, add this piece of code in the layout;