sapui5 - How to handle the itemPress of a table? -
sapui5 - How to handle the itemPress of a table? -
i've written xml view. within there table:
<table xmlns="sap.m" id="mytable" select="" selectionchange="" swipe="" growingstarted="" growingfinished="" updatestarted="" updatefinished="" itempress="function(){ console.log('clicked on item'); }"> <items> <!-- sap.m.listitembase --> </items> <columns> <!-- sap.m.column --> </columns> </table>
i insert row table using oninit
of controller, when click on row, message not shown.
this seems frequent issue people face when utilize sap.m.listbase
related controls. allow me give overview on how manage events (and particularly activate them @ all):
the confusion related sap.m.listmode
of controls inheriting sap.m.listbase
, sap.m.listtype
of items inheriting sap.m.listitembase
.
let´s assume next sample list:
var list = new sap.m.list({ selectionchange : [ ocontroller.onselectionchange, ocontroller ], itempress : [ ocontroller.onitempress, ocontroller ], items : [ new sap.m.objectlistitem({ title : "hello listitem", press : [ ocontroller.onlistitempress, ocontroller ] }) ] });
sap.m.listmode if you´re using sap.m.list
ore sap.m.table
event firing depends on mode
you´re using. unfortunately list/table without mode
property not fire event side! if want list/table fire events have assign mode, example:
var list = new sap.m.list({ ... mode : sap.m.listmode.singleselect, ... });
these possible modes documentation:
sap.m.listmode.delete sap.m.listmode.multiselect sap.m.listmode.none sap.m.listmode.singleselect sap.m.listmode.singleselectleft sap.m.listmode.singleselectmastersap.m.listmode.none (default)
since no mode
property assigned none of events fired!
sap.m.listmode.singleselect | singleselectleft
a list command mode : sap.m.listmode.singleselect
shows radiobutton on right side of each item , fire onselectionchange
event user clicks on given radio button control. using singleselectleft moves radio button left side of item.
sap.m.listmode.singleselectmaster
a list command mode : sap.m.listmode.singleselectmaster
show hand on mouseover , fires onselectionchange
in case of click on item
sap.m.listmode.multiselect
a list command in mode : sap.m.listmode.multiselect
offers checkbox , fires onselectionchange
event on every check , uncheck of item.
sap.m.listmode.delete
using list in mode : sap.m.listmode.delete
gives nice delete button , fires ondelete
.
there´s 1 more property should have at: type
property of items.
every item inherits sap.m.listitembase
, has attribute called type
. let´s see how looks like:
items : [ new sap.m.objectlistitem({ ... type : sap.m.listtype.active, ... }) ]
there these types listed in documentation:
sap.m.listtype.active sap.m.listtype.detail sap.m.listtype.detailandactive sap.m.listtype.inactive sap.m.listtype.navigationsap.m.listtype.active
in add-on event depending on mode
onitempress
of list , onlistitempress
of item gets fired. selected items gets highlighted user can see what´s selected. mouseover link.
sap.m.listtype.detail
only onitempress
gets called. items rendered more height more details. in add-on detail button offered fires ondetailpress
event of item.
sap.m.listtype.detailandactive
as name says combination of detail , active type have detail button, link-like mouseover , onitempress
, itempress
fired.
sap.m.listtype.inactive
no item event gets called @ item itself.
sap.m.listtype.navigation
the items have navigation , onitempress
, onlistitempress
called.
now let´s take @ problem. should either assign table command mode
or assign items type
. after alter events should fired.
generally avoid using listmode
, listtype
@ same time since there can unexpected behavior check yourself.
update: meanwhile there´s nice comparing illustration see visual differences of listmodes in explored app of openui5. utilize dropdown in top right corner switch modes.
sapui5 sapui sap-fiori
Comments
Post a Comment