SAP C4C裡如何建立兩個具有依賴關係的下拉選單
My series of Cloud Application Studio Blogs
- How to detect EditMode in an Embedded Component
- Step by step to enable your custom BO with attachment upload functionality
- Step by step to create an Adobe Print form in Cloud application Studio
- How to render PDF which displays picture from the image attachment of your custom BO
- How to get current logged on business user’s employee information and assigned organization unit via ABSL
- How to implement dynamic access control based on custom BO using OWL
- How to make Code List Restriction work when control field and restricted field are not on the same BO
- How to implement custom number range using custom business object
- Two approaches to create Code List in Cloud Studio
- Create Dynamic Code List via Custom Business Object Association
- Step by step to develop Thing Type based navigation and BO Object based navigation
- Put Extension field into embedded component and make it visible in Standard UI
- One possible cause that embedded component fails to display in UI
- Step by step to create HTML Mashup and make it visible in UI
- Step by step to enable Text Collection for your custom BO
- Automatically send an Email notification to line manager via Workflow in Account application
- Step by step to create Object Value Selector in Cloud Application Studio
- Two approaches to fill an UI field with dedicated logic implemented in Cloud Application Studio
- How to execute BO action on multiple selected BO instances in AdvancedListPane
- How to add custom validation logic on mobile phone field in Contact TI
- An example about how I analyze why some OBN button does not work
- Step by step to create OBN button which navigates from standard UI to custom UI
- Service Request ticket split – how to bring the selected service request item to new custom UI
- Step by step to create two drop down list with dependency
- Expose Custom BO logic implemented by ABSL via Custom OData service
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.
要獲取更多Jerry的原創文章,請關注公眾號"汪子熙":
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/24475491/viewspace-2724416/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 如何在SAP Cloud for Customer裡開發具有依賴關係的互動下拉選單Cloud
- 如何在 SAP BTP 上建立 Module 之間具有依賴關係的 SAP MTA 應用
- Maven 依賴關係Maven
- 關聯關係與依賴關係的區別
- build task依賴關係UI
- js如何互換兩個select下拉選單的option項JS
- 透過構建具有依賴關係的後端框架來學習 Nodejs後端框架NodeJS
- OSGI中的service依賴關係管理
- Maven中如何管理多模組專案的依賴關係Maven
- 如何管理前端專案中的複雜依賴關係前端
- 使用簡單的Java程式碼在SAP C4C裡建立銷售訂單Java
- Spring框架模組依賴關係Spring框架
- mysql主外來鍵依賴關係MySql
- depmod解決模組依賴關係
- 【物件導向依賴關係概念總結】物件導向程式設計的五種依賴關係物件程式設計
- Android專案的依賴關係解析Android
- 分析資料庫的依賴關係(轉)資料庫
- Vue.js自定義下拉選單,如何實現在下拉選單區域外點選即可關閉下拉選單的功能Vue.js
- 兩個select下拉選單的option相互移動
- 【python】【安裝包依賴關係】Python
- 解決rpm包依賴關係
- Java基礎:如何在IDEA中檢視依賴關係JavaIdea
- 專案管理中,如何識別和管理依賴關係?專案管理
- Oracle 查詢鎖之間的依賴關係Oracle
- 如何給SAP C4C的產品主資料division配置出新的下拉選項
- SAP Spartacus OccEndpointsService單元測試的依賴注入依賴注入
- 兩個類的關係,應該如何關聯?
- 幽默:如何建立一個良好的關係?
- Elasticsearch依賴與Spring對應關係ElasticsearchSpring
- 使用 .NET Core 實現依賴關係注入
- JavaScript裡的依賴注入JavaScript依賴注入
- 透過shell分析表依賴的層級關係
- maven中scope依賴範圍與classpath的關係Maven
- .NET Core新增專案之間的依賴關係
- 通過shell分析表依賴的層級關係
- 使用yum 安裝依賴關係較多的包
- Gradle的Task(2)任務間的依賴關係Gradle
- gcc 標頭檔案依賴關係 分析工具GC