I have been working as a Fiori application developer in SAP for almost two years, which means now I use Chrome development tool in my daily work for trouble shooting instead of ABAP debugger when I was working using CRM WebUI.
Yesterday I was assigned with an incident about CRM Lead application in WebUI, and I am glad to figure out that Chrome development tool can also do me a great favor for my trouble shooting in WebUI issue. I share with my experience learned in this blog.
Issue description
The incident complains that when a given row in Products assignment block is selected and Delete button in toolbar is clicked, nothing occurs.
My issue analysis process
I located the event handler of this delete button in toolbar:
And I find out that get_marked in line 21 return an empty BOL entity collection.
I debugged into get_marked, this method will only return those BOL entities as marked whose SELECTED equals to true. For Lead application, all the BOL entities which represent table entries in assignment block has SELECTED as false, as a result no BOL entity is returned – so nothing to be deleted.
However I have checked Opportunity application, the deletion works. The attribute for BOL entity is set as abap_true as expected.
What is the reason of this different behavior? Research how WebUI passes table selected row information to ABAP backend via Chrome development tool In WebUI I selected first row in table and click delete button in toolbar, then I observe this selected information is passed to ABAP backend via field name asC34_W111_V113_V120_prodtable_selectedRows and value as 1.
And in ABAP backend, all these http form fields passed from frontend UI are received and stored in variable lt_fields in line 25.
I download the content of lt_fields as excel and highlight the field for selected row index:
Then in ABAP backend, it is expected to populate the string “C34_W111_V113_V120_prodtable_selectedRows” to get the index by field name. From the code below we get: “C34_W111_V113_V120_prodtable“
The left string fragment “selectedRows” comes from constant gc_selected_rows. Now the selected row index is get by field name in line 14.
The original issue is: although we have table id “prodtable”,
however a wrong default id “Table” is passed in via iv_id and thus wrong field name is generated, so based on this wrong field name, no selected index could be queried:
The issue is already fixed via SAP note 2331513. The naming convention of capital characters in lv_name:
- C: component
- W: window
- V: view
You can also find such id in generated html source code via Chrome development tool in Element tab: first click the small icon highlighted below and then click the UI area you would like to inspect:
Then in Elements tab, the html source code of the selected UI area will be displayed for you:
Further reading
- Chrome Development Tool tips used in my daily work
- My UI5 debugging tips and experience collection – how to resolve UI5 issues through debugging by yourself
要获取更多Jerry的原创文章,请关注公众号"汪子熙":
相关推荐
SAP CRM WebClient UI 培训 Slide
CRM7.0 WebClient UI config
Sent: Thursday, April 18, 2013 3:59 PM Subject: 为什么design time时候看到的是ICQR,点了service之后看到02QR的代码被call到 这是cross component navigation在起作用。 Result list是model在ICQR里面,如果点...
Sent: Thursday, May 9, 2013 6:30 PM Subject: ON_NEW_FOCUS的用途 ROOT ———————————— Product ID PRODshortText ———————————— Product Description Genil Model hierarchy
UI Guidelines for CRM WebClient User Interface
C# WebClient 上传文件 WebClient上传文件至服务器
C# WebClient实现文件下载 示例源码
WebClient jar包
webui学习者
WebClient上传下载源码 我们先在IIS网站中建立一个文件夹,此处为"Mp3",并设置此文件夹相关读写权限。 例1:使用WebClient中的UploadFile方法上传文件。代码如下。使用此方法需要将上传的文件夹权限设置为 IIS来宾...
c#中的WebClient的用法,模拟请求
本篇文章主要介绍了C#中WebClient实现文件下载,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
支持 Session 和 Cookie 的 WebClient
基于webClient 的ftp操作,该案例是基于http模式,如果是ftp,直接将http改成ftp即可
WebClient下载文件展示进度条
webClient 服务器端与客户端配置
使用WebClient的UploadFileAsync、UploadFile、DownloadFile、DownloadFileAsync方法,异步调用服务器上传下载数据。
使用WebClient实现文件下载,进度条反应下载进度。
WebClient的例子,在Eclipse中直接可以运行
htmlunit webclient下载资源,谨慎运行,我设置的下载是1000次,想做个刷下载量的东西,然并卵