B4J Tutorial [BANAnoWebix] Lesson 11 Unit List

Ola

Unit lists enable one to group lists by common ground, e.g. first letter of alphabet for the selected field.

For this example, we use the dummy data generator and then unite the list by the title after the page is rendered. This has an effect of using a callback to set the unit list grouping.

Create the Unit List...

Dim ul As WixUnitList
    ul.Initialize("ulx")
    ul.Setheight(500)
    ul.SetTemplate("#title#<br>#year#")
    ul.SetBorderLess(False)
    ul.SetStyle("margin", "10px")
    ul.SetItemHeight(80)
    '
    Dim dummy As UOENowData
    dummy.Initialize
    Dim data As List = dummy.GetRecordsWithStructure(CreateMap("id": "id", "title": "name", "year": "year") ,10)
    ul.SetData(data)

Add an event so that we know what was clicked and also set the .UniteBy(?) field name.

pg.ui
    '
    Dim eID As String
    pg.OnItemClick("ulx", BANano.CallBack(Me, "item_select", Array(eID)))
    ' do this after ux
    pg.SetUniteBy("ulx", "title")
End Sub

Sub item_select(eID As String)
    eID = pg.CStr(eID)
    Dim m As Map = pg.GetItem("ulx", eID)
    pg.Message(BANano.ToJson(m))
End Sub

NB: Always set .UniteBy after the UI is rendered...

What uniteby does is to call a WixPage method on the element to update the uniteBy property of the Unit List like this..

'set uniteby should be an existing field
Sub SetUniteBy(ulID As String, fldName As String)
    ulID = ulID.tolowercase
    fldName = fldName.tolowercase
    uniteFld = fldName
    ulName = ulID
    'define unite by
    Dim obj As Map
    Dim cb As BANanoObject = BANano.CallBack(Me, "uniteby", Array(obj))
    Dim opt As Map = CreateMap()
    opt.Put("uniteBy", cb)
    Define(ulName, opt)
    Refresh(ulName)
End Sub

private Sub uniteby(obj As Map) As String
    Dim stitle As String = obj.Get(uniteFld)
    Dim ub As String = stitle.SubString2(0,1)
    Return ub
End Sub