首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >SAP C4C里如何创建两个具有依赖关系的下拉菜单

SAP C4C里如何创建两个具有依赖关系的下拉菜单

作者头像
Jerry Wang
发布2020-08-31 15:34:25
1.4K0
发布2020-08-31 15:34:25
举报

I am asked by colleague about how to develop two drop down list with dependency via Cloud application studio. Typical use case could be for example the first one gives user a list of countries in the world, and once a certain country code is selected, only the very states belonging to that country is listed in the second drop down list.

Here below is a kind of approach how to achieve it.

Suppose the first list is a set of programming language,

when I select ABAP, only ABAP tools are listed in the second list.

The same for Java List:

Before you start the development, make sure you have gone through the blog Create Dynamic Code List via Custom Business Object Association as this blog is written based on some enhancement on it.

(1) The complete source code of JerryCodeList BO:

Create the following instance for this BO: Language list:

Java tool list:

ABAP tool list:

(2) In the MainBO on which the two dependent code lists are built, inserted the following highlighted source code:

Implement the association ToLanguageList in AfterModify determination:

if( !this.ToLanguageList.IsSet() ){
	var codeListQuery = JerryCodeList.QueryByElements;
	var para = codeListQuery.CreateSelectionParams();
	para.Add( codeListQuery.CodeListBOID, "I", "EQ", "LANGUAGE");
	var result = codeListQuery.Execute(para);
	this.ToLanguageList	= result.GetFirst();
}

For the other association ToLanguageToolList, we should NOT implement it in AfterModify since it is dependent on the selection of first drop down list.

(3) Bind two drop down list accordingly:

The essential part here is: as long as there is selection change on the first drop down list, the notification must be sent to second drop down list to perform restriction on its entries. Here a new event handler is introduced for notification.

Create a new query bound to CodeList.QueryByElements with a query parameter which points to Code List entry’s parent code:

then in the event handler, in the first operation I assign the selected language code chosen from first drop down list to the query parameter, then fire the query in the second operation, as a result the possible entries for the second drop down list are restricted by language code accordingly.

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2020-08-27 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档