ABAPWebDynpro实例Word下载.docx
《ABAPWebDynpro实例Word下载.docx》由会员分享,可在线阅读,更多相关《ABAPWebDynpro实例Word下载.docx(40页珍藏版)》请在冰豆网上搜索。
3、生成Node“Z_ORDER_GUID”,并在属性界面显示在创建时选定的属性,如图1.2.1.1-3:
图1.2.1.1-3
a、可以在属性界面直接修改Node的属性。
1.2.1.2创建Attribute节点
1、右击需要创建Attribute的Node“Z_ORDER_GUID”,选择“Create”下的“Attribute”,如图1.2.1.2-1:
图1.2.1.2-1
2、输入AttributeName,然后选择Typeassignment和Type(根据实际需要输入),然后打钩,如图1.2.1.2-2:
图1.2.1.2-2
a、也可以通过图中的“AdditionalAttribute”按钮进行导航添加。
3、生成Attribute“ORDER_GUID”,属性框中显示了创建时选择的参数,如图1.2.1.2-3:
图1.2.1.2-3
a、可以在属性框中直接修改属性值。
1.3视图设计
WebDynpro程序的控制器设置完后,就可以进行程序界面及逻辑处理的开发,在程序中就是对视图进行开发设计,而视图下又分为了Properties、Layout、InboundPlugs、OutboundPlugs、Context、Attributes、Actions、Methods这8个设计页签,也就是熟悉了这8个页签的设计也就熟悉了WebDynpro程序的视图设计。
在操作之前先简要介绍下上面8个页签的主要功能:
Properties:
显示视图的主要信息,通常不需要修改;
Layout:
设计视图界面的布局以及数据绑定;
InboundPlugs:
入站处理(用于别的页面跳转到该页面);
OutboundPlugs:
出站处理(用于跳转的别的页面的判断);
Context:
节点设置,也就是定义参数;
Attributes:
属性界面,显示自动生成的类型,供程序逻辑开发时使用;
Actions:
事件处理,自动根据按钮生成事件名;
Methods:
方法,用于程序逻辑的处理。
下面将详细介绍视图开发设计。
1.3.1创建Context-Node、Context-Attribute
在Context中创建了参数以后,才能在Methods、Actions中使用并给参数赋值,并将参数的值传递给绑定的Layout的元素中。
在前面1.2.1已经介绍了自定义Node、Attribute的方法。
而在本节将介绍根据系统的结构进行定义,并定义四个Node:
1、Node“Z_ORDER_PRINT_H”(采购订单抬头信息)创建:
右击需要创建NODES的节点“CONTEXT”,选择“Create”下的“Node”,如图1.3.1-1:
图1.3.1-1
2、输入NodeName,然后输入要参考的结构名,再选择其他参数,选择完后点击”AddAttributesFromStructure“进行结构的字段选择(为Node创建Attributes),如图1.3.1-2:
图1.3.1-2
3、根据业务需要选择需要使用的字段,然后打钩,如图1.3.1-3:
图1.3.1-3
4、生成Node并显示刚选定的字段生成相应的Attributes,如图1.3.1-4:
图1.3.1-4
a、Node"
Z_ORDER_PRINT_H"
等同于定义了名为Z_ORDER_PRINT_H,含有4个字段的工作区;
b、Node的Attributes也可以在图中的“DictionaryStructure”中进行添加;
c、Node"
在本练习中为采购订单抬头行项,所以基数“Cardinality”选择为1(1行数据)。
5、参考1-4步创建Node"
Z_ORDER_PRINT_I"
(采购订单行项目信息),如图1.3.1-5:
图1.3.1-5
在本练习中为采购订单行项目,所以基数“Cardinality”选择为0(0-n行数据),“Selection”参数也是选择0(0-n行数据),也只有选择0才能实现数据行的多选。
6、参考1-4步创建Node"
Z_ORDER_PARTNER"
(采购订单合作伙伴信息),如图1.3.1-6:
图1.3.1-6
a、图中的Attributes没有全部列出来,如果参照改练习做的话在选择合作伙伴Node时可用全选字段。
7、参考1-4步创建Node"
Z_ORDER_SEL"
(用于存放选中的数据行信息),如图1.3.1-7,其对应的Attribute属性如图1.3.1-8:
图1.3.1-7
图1.3.1-8
a、图1.3.1-8中显示的是Attribute的属性(自定义),前面几个Node的Attributes就不显示属性了,因为是参照系统结构的。
到这里视图“MAIN”的Context就定义完成了。
1.3.2创建Layout-Element
定义完Context后,接下来就是给视图创建Layout-Element(布局元素),该练习使用的元素有以下几种:
Label:
标签;
TextView:
文本显示框(不可编辑)
TextEdit:
文本显示框(可编辑)
Table:
表格
TableColumn:
表格中的列
Button:
按钮
另外,也还有很多的元素可使用,具体可尝试使用。
下面就介绍本练习使用的元素的创建方法。
1.3.2.1创建Label元素
1、点击“Layout”页签,如果是进入该程序首次点击“Layout”,会弹出登录的提示框,点击“确定”,如图1.3.2.1-1,如果不是首次则直接显示布局,如图1.3.2.1-2:
图1.3.2.1-1
图1.3.2.1-2
2、右击需要创建元素的组件,选择“InsertElement”进行新建Element,如图1.3.2.1-3:
图1.3.2.1-3
3、输入Element的ID,选择“LABEL”类型,然后打钩,如图1.3.2.1-4:
图1.3.2.1-4
4、生成Label元素,并在布局界面显示,修改元素的“text”属性为“凭证日期”,如图1.3.2.1-5:
图1.3.2.1-5
Label元素就创建好了。
1.3.2.2创建TextView元素
1、参照1.3.2.1创建类型为“TEXT_VIEW”的元素,如图1.3.2.2-1:
图1.3.2.2-1
2、点击TextView元素属性中“text”对应的按钮,在弹出的绑定窗口中进行元素与Context节点的绑定,选中需要绑定的Context节点,然后打钩,如图1.3.2.2-2:
图1.3.2.2-2
3、绑定后在属性框中显示绑定对应的结构-字段,如图1.3.2.2-3:
图1.3.2.2-3
4、绑定“text”后还需要进行“enabled”设置,如图1.3.2.2-4:
图1.3.2.2-4
5、“enabled”设置后,如图1.3.2.2-5:
图1.3.2.2-5
就完成了TextView元素的创建。
1.3.2.3创建Table元素
1、参照1.3.2.1创建类型为“TABLE”的元素,如图1.3.2.3-1:
图1.3.2.3-1
2、创建Table元素后,为其绑定数据源,操作如图1.3.2.3-2:
图1.3.2.3-2
3、绑定后在属性中显示绑定源,如图1.3.2.3-3:
图1.3.2.3-3
1.3.2.4创建TableColumn元素
TableColumn元素只能在Table元素下创建。
而且创建TableColumn后还得为TableColumn创建TextView(参考1.3.2.2)、TextEdit(参考1.3.2.5)等元素后才能在Table中显示数据,TableColumn创建操作步骤如下:
1、右击Table元素,选择“InsertGROUPColumn”,如图1.3.2.4-1:
图1.3.2.4-1
2、输入元素ID,选择“TABLE_COLUMN”类型,然后打钩,如图1.3.2.4-2:
图1.3.2.4-2
3、生成TableColumn元素,如图1.3.2.4-3:
图1.3.2.4-3
a、创建完TableColumn后会自动生成一个Label元素。
创建完TableColumn以后就可以为其创建相关的TextView、TextEdit元素了。
4、TextView(不可编辑元素)创建:
参照1.3.2.1为TableColumn创建TextView,如图1.3.2.4-4:
图1.3.2.4-4
5、TextEdit(可编辑元素)创建:
参照1.3.2.5为TableColumn创建TextEdit,如图1.3.2.4-5:
图1.3.2.4-5
创建完毕。
1.3.2.5创建TextEdit元素
本练习的TextEdit元素是在TableColumn下创建的,创建步骤如下:
1、右击Table元素,选择“InsertGROUPColumn”,如图1.3.2.5-1:
图1.3.2.5-1
2、输入元素ID,选择类型“TEXT_EDIT”,然后打钩,如图1.3.2.5-2:
图1.3.2.5-2
3、创建TextEdit后需要为其绑定数据源,操作如图1.3.2.5-3:
图1.3.2.5-3
4、指定完数据源后,需要配置“enabled”,操作如图1.3.2.5-4:
图1.3.2.5-4
5、配置完“enabled”,操作如图1.3.2.5-5:
图1.3.2.5-5
就完成了TextEdit的创建。
1.3.2.6创建Button元素
当Web页面中的数据需要操作或者打印时,可通过按钮来触发事件,以实现数据处理,Button创建步骤如下:
1、右击需要创建Button的组件,选择“InsertElement”,如图1.3.2.6-1:
图1.3.2.6-1
2、输入Button的ID,选择“BUTTON”类型,然后打钩,如图1.3.2.6-2:
图1.3.2.6-2
3、生成Button后,在“text”中为Button命名,然后在“onAction”中为按钮指定触发的事件“PRINT”(在生成Button后保存操作系统就会自动生成该事件,可以在“Actions”页签中找到该事件并对其进行逻辑设计,后续会讲到),如图1.3.2.6-3:
图1.3.2.6-3
Button添加完毕,而Button生成的事件及其对应的处理器在“Actions”页签中进行,后续会讲到。
到这里该练习所使用到的Layout元素就都介绍到了。
1.3.3Attributes属性介绍
前面创建了WebDynpro程序后,Attributes页签中就会生成3个属性,并对应关联的类型,如图1.3.3-1:
图1.3.3-1
a、WD_CONTEXT用于关联Main视图中的Context,使得数据在查询后可以显示到Layout元素中;
b、WD_THIS用于MAIN视图内部的自关联,略;
c、WD_COMP_CONTROLLER用于管理WebDynpro程序中的控制器COMPONENTCONTROLLER,这样才能将控制器中的Context在MAIN视图中可以引用。
1.3.4视图初始化数据处理
在前面两个页签中已经把Context(参数)和布局(Layout)元素完成了定义和绑定,接下来就为视图进行数据初始化输出处理。
操作步骤如下:
1、在视图的“Methods”页签中,找到“WDDOINIT”方法,双击进行代码编写,如图1.3.4-1:
图1.3.4-1
2、代码如下:
method
WDDOINIT
.
DATA:
lo_component
TYPE
REF
TO
if_wd_component,
lo_context
if_wd_context,
lo_controller
type
if_wd_controller,
lo_node
if_wd_context_node,
lo_child
lo_cmp_usage
if_wd_component_usage,
lv_guid
bbp_guid,
lr_header_order
BBP_PDS_SUSPO_HEADER_D,
lr_items_order
STANDARD
TABLE
OF
BBP_PDS_SUSPO_ITEM_D,
ls_items_order
lr_partern
BBP_PDS_PARTNER,
node_order_h
node_order_i
node_order_p
if_wd_context_node.
=
wd_comp_controller->
wd_get_api(
).
?
lo_component.
CALL
METHOD
lo_controller->
get_context
RECEIVING
context
lo_context.
lo_context->
root_node.
lo_node->
get_child_node(
'
Z_ORDER_GUID'
lo_child->
GET_ATTRIBUTE
EXPORTING
NAME
ORDER_GUID'
IMPORTING
VALUE
lv_guid.
"
通过调用函数BBP_PD_SUSPO_GETDETAIL根据lv_guid(URL)查询采购订单信息
FUNCTION
BBP_PD_SUSPO_GETDETAIL'
I_GUID
lv_guid
E_HEADER
lr_header_order
*
ET_ATTACH
=
TABLES
E_ITEM
lr_items_order
E_PARTNER
lr_partern.
loop
at
INTO
ls_items_order.
SHIFT
ls_items_order-ordered_prod
LEFT
DELETING
LEADING
0'
ls_items_order-SRC_ITM_ID
ls_items_order-NUMBER_INT
modify
FROM
ENDLOOP.
DELETE
WHERE
PARTNER_FCT
<
>
00000019'
WD_CONTEXT->
get_Child_Node(
name
Z_ORDER_PRINT_H'
Z_ORDER_PRINT_I'
Z_ORDER_PARTNER'
node_order_h->
BIND_STRUCTURE(
node_order_i->
bind_table(
node_order_p->
endmethod.
1.3.5Button事件处理
Layout中添加了按钮后,会在”Actions“页签中生成与之对应的“Action”(即按钮的事件名)和“EventHandler”(事件实现功能的方法名),。
下面就对前面添加的按钮进行事件处理,操作步骤如下:
1、在视图的“Actions”页签中,找到按钮对应的事件“PRINT”对应的Handler“ONACTIONPRINT”,双击进行代码编写,如图1.3.5-1:
图1.3.5-1
ONACTIONPRINT
LV_FUNCTION_NAME
RS38L_FNAM,
LS_ARCHIVE_INDEX
TOA_DARA,
LS_ARCHIVE_PARAMETERS
ARC_PARAMS,
LT_ARCHIVE_INDEX
TSFDARA,
LV_PPF_SAP_OBJECT
SAEANWDID,
LV_PPF_AR_OBJECT
SAEOBJECT,
LS_CONTROL_PARAMETERS
SSFCTRLOP,
LS_OUTPUT_OPTIONS
SSFCOMPOP,
LV_MEDIUM_TYPE
PPFDMETYPE,
LS_MAIL_APPL_OBJ
SWOTOBJID,
LS_MAIL_RECIPIENT
LS_MAIL_SENDER
LV_USER_SETTINGS
TDBOOL
X'
LS_FORM_ATTACHMENT
BBPS_FORMS_OUTPUT,
LT_ERROR_BID
BBP_TR_ERROR,
LV_ARCHDONE
TDARCDONE,
LV_ARCHIVE_COPIES
TDARCCOP,
LV_ARMOD
SYARMOD,
LV_PPF_ARMOD
LS_DOCUMENT_OUTPUT_INFO
SSFCRESPD,
"
#EC
NEEDED
LS_JOB_OUTPUT_INFO
SSFCRESCL,
LS_JOB