Page 1 of 1

Give focus to an Edit field in a PRIM_MD.List or PRIM_LIST?

Posted: Wed Apr 17, 2019 8:24 pm
by pkoopmanpk
Is it possible to give focus to a specific PRIM_MD.ListEdit item in a PRIM_MD.List or a cell in a PRIM_LIST?

I need to give focus to the first empty field in a list. But I can not find a way to do this.

Code sample 1 using a PRIM_MD.List:

Code: Select all

Begin_Com Role(*EXTENDS #PRIM_WEB) Theme(#SYS_THEME<MaterialDesignBlue>)

Define_Com Class(#PRIM_MD.List) Name(#ListPackages) DisplayPosition(1) Height(480) RowHeight(34) TabPosition(1) Width(903) Parent(#COM_OWNER)
Define_Com Class(#PRIM_MD.ListLabel) Name(#PackageType) Caption('type') DisplayPosition(3) Height(34) TabPosition(3) Top(0) Width(80) Left(32) CaptionMarginLeft(5) Parent(#ListPackages)
Define_Com Class(#PRIM_MD.ListEdit) Name(#PackageId) Caption('ID') DisplayPosition(1) Height(34) Left(112) TabPosition(1) Top(0) Width(120) CaptionPosition(None) HelperPosition(None) MaxLength(15) Placeholder('ID') Parent(#ListPackages)
Define_Com Class(#PRIM_MD.ListLabel) Name(#PackageDescription) Caption('Description') DisplayPosition(4) Height(34) Left(232) TabPosition(4) Width(669) Top(0) CaptionMarginLeft(5) Parent(#ListPackages)

Evtroutine Handling(#Com_owner.Initialize)
Define_Com Class(#Prim_nmbr) Name(#counter)

#PackageId := ''

* Fill list with dummy data
Begin_Loop Using(#counter) To(10)
#PackageType := 'Box'
#PackageDescription := ('Box #&1').Substitute( #counter.AsString )

Add_Entry To_List(#ListPackages)

#PackageId.CurrentItem.Placeholder := 'B...'
If (#counter <= 3)
#PackageId.CurrentItem.Value := ('B&1').Substitute( #counter.AsString )
Endif
End_Loop

* Try to give focus to first empty ListEdit element
Selectlist Named(#ListPackages)
If (#PackageId.CurrentItem.Value = '')
#ListPackages.CurrentItem.Focus := True
#PackageId.SetFocus
* Error: #PackageId.CurrentItem.Focus := True
* Error: #PackageId.CurrentItem.SetFocus
Leave
Endif
Endselect

#SYS_WEB.Console.Log( #PackageDescription.FocusItem.Caption )
* Result: Box #4

Endroutine

End_Com
Code sample 2 using a PRIM_LIST:

Code: Select all

Begin_Com Role(*EXTENDS #PRIM_WEB) Theme(#SYS_THEME<MaterialDesignBlue>)

Define_Com Class(#PRIM_LIST) Name(#ListPackages) DisplayPosition(1) Height(480) RowHeight(34) TabPosition(1) Width(903) Parent(#COM_OWNER) ColumnHeaderHeight(0)
Define_Com Class(#PRIM_LIST.String) Name(#ListPackagesColumn1) ColumnUnits(Proportion) ColumnWidth(1) DisplayPosition(1) Parent(#ListPackages) SortOnClick(True) Source(#STD_TEXTS) Enabled(False)
Define_Com Class(#PRIM_LIST.String) Name(#ListPackagesColumn2) ColumnUnits(Proportion) ColumnWidth(2) DisplayPosition(2) Parent(#ListPackages) SortOnClick(True) Source(#STD_TEXT) ColumnReadOnly(False)
Define_Com Class(#PRIM_LIST.String) Name(#ListPackagesColumn3) ColumnUnits(Proportion) ColumnWidth(4) DisplayPosition(3) Parent(#ListPackages) SortOnClick(True) Source(#STD_TEXTL) Enabled(False)


Evtroutine Handling(#Com_owner.Initialize)
Define_Com Class(#Prim_nmbr) Name(#counter)

#STD_TEXT := ''

* Fill list with dummy data
Begin_Loop Using(#counter) To(10)
#STD_TEXTS := 'Box'
If (#counter <= 3)
#STD_TEXT := ('B&1').Substitute( #counter.AsString )
Else
#STD_TEXT := ''
Endif
#STD_TEXTL := ('Box #&1').Substitute( #counter.AsString )

Add_Entry To_List(#ListPackages)
End_Loop

* Try to give focus to first empty ListEdit element
Selectlist Named(#ListPackages)
If (#STD_TEXT = '')
#ListPackagesColumn2.AutoSelect := True
#ListPackages.AutoSelectItem := True
#ListPackages.CurrentItem.Focus := True
* Error: #STD_TEXT.SetFocus
Leave
Endif
Endselect

#SYS_WEB.Console.Log( #STD_TEXTL )
* Result: Box #4

Endroutine

End_Com
This one gives focus to the correct line, but not the correct cell. The first cell gets "focus", so I need to tab to the second one.

And even if I make the edit field displayposition 1, I still need to click, touch or tab out/in the cell to set it to edit mode.

Update: I'm studying PRIM_TILE now. Maybe that'll do what I want.

Re: Give focus to an Edit field in a PRIM_MD.List or PRIM_LIST?

Posted: Wed Apr 17, 2019 10:57 pm
by lawingo

Code: Select all

* Select 1st Record
Selectlist Named(#GridMain)
Set Com(#GridColumn6.Cell<1>.Column) Focus(True) Selected(True) Ensurevisible(True)
Set Com(#GridMain.CurrentItem) Selected(True) Focus(True) Ensurevisible(True)

Leave
Endselect

#GridMain.SetFocus
Hope this helps.

Best,
Chad

Re: Give focus to an Edit field in a PRIM_MD.List or PRIM_LIST?

Posted: Fri Apr 19, 2019 4:45 pm
by pkoopmanpk
lawingo wrote:
Wed Apr 17, 2019 10:57 pm
Hope this helps.
Thank you for your reply.

Cells are a property of PRIM_GRID? As far as i know PRIM_GRIDs can't be used in VL web? PRIM_GRID would be perfect, but I got an error when I copied the code from one of my VL windows projects. Also, it isn't shown in the controls tab when I have open a Webbrowser target source.

I found a working solution using a PRIM_TREE. It's a bit more work than a grid tho.

Re: Give focus to an Edit field in a PRIM_MD.List or PRIM_LIST?

Posted: Fri Apr 19, 2019 4:53 pm
by pkoopmanpk
This is a solution I found.

It uses a PRIM_TREE and a PRIM_PANL that implements PRIM_TREE.iTreeDesign

Component PKTSTTRE:

Code: Select all

Function Options(*DIRECT)
Begin_Com Role(*EXTENDS #PRIM_PANL *implements #PRIM_TREE.iTreeDesign *ListFields #LISTFIELDS) DisplayPosition(1) Height(33) LayoutManager(#Table) Left(0) TabPosition(1) Top(0) Width(576) ThemeDrawStyle('ListItem') TabStop(False)

* Fields mapped in when the entry is added to the Tree
Group_By Name(#LISTFIELDS) Fields(#STD_TEXT #STD_TEXTS #STD_TEXTL)

Define_Com Class(#PRIM_LABL) Name(#PackageType) Caption('Type') DisplayPosition(1) Ellipses(Word) Height(32) Left(0) MarginLeft(2) Parent(#COM_OWNER) TabPosition(1) TabStop(False) Top(0) VerticalAlignment(Center) Width(80)
Define_Com Class(#STD_TEXT.EditField) Name(#STD_TEXT) DisplayPosition(2) Height(32) Left(80) Parent(#COM_OWNER) TabPosition(2) Top(0) Width(120) CaptionPosition(None) HelperPosition(None)
Define_Com Class(#PRIM_LABL) Name(#PackageDescription) Caption('Description') DisplayPosition(3) Height(32) Left(200) MarginLeft(5) TabStop(False) Parent(#COM_OWNER) TabPosition(3) Top(0) Width(376) VerticalAlignment(Center)

Define_Com Class(#PRIM_TBLO) Name(#Table)
Define_Com Class(#PRIM_TBLO.Column) Name(#Column1) Parent(#Table) Units(Pixels) Width(80) DisplayPosition(1)
Define_Com Class(#PRIM_TBLO.Column) Name(#Column2) Parent(#Table) Units(Pixels) Width(120) DisplayPosition(2)
Define_Com Class(#PRIM_TBLO.Column) Name(#Column3) Parent(#Table) DisplayPosition(3)
Define_Com Class(#PRIM_TBLO.Row) Name(#Row1) Height(32) Parent(#Table) Units(Pixels) DisplayPosition(1)

Define_Com Class(#PRIM_TBLO.item) Name(#Item1) Column(#Column1) Manage(#PackageType) Parent(#Table) Row(#Row1)
Define_Com Class(#PRIM_TBLO.item) Name(#Item2) Column(#Column2) Parent(#Table) Row(#Row1)
Define_Com Class(#PRIM_TBLO.item) Name(#Item3) Column(#Column3) Manage(#PackageDescription) Parent(#Table) Row(#Row1)
Define_Com Class(#PRIM_TBLO.Item) Name(#TableItem1) Parent(#Table) Row(#Row1) Sizing(FitToWidth) Column(#Column2)

Mthroutine Name(OnAdd) Options(*REDEFINE)

#PackageType := #STD_TEXTS
#PackageDescription := #STD_TEXTL

Endroutine

Mthroutine Name(OnItemGotFocus) Help('Executed when the item becomes the focus item') Options(*REDEFINE)
* Only needed the first time?
#STD_TEXT.SetFocus
Endroutine

End_Com
Webpage:

Code: Select all

Begin_Com Role(*EXTENDS #PRIM_WEB) Theme(#SYS_THEME<MaterialDesignBlue>)

Define_Com Class(#PRIM_TREE<#PKTSTTRE>) Name(#ListPackages) DisplayPosition(1) Parent(#COM_OWNER) TabPosition(1) Height(480) Width(569) ThemeDrawStyle('Card')

Define_Com Class(#PRIM_STPG) Name(#ShortcutKey1) Parent(#COM_OWNER) ShortCut(Enter)

Evtroutine Handling(#Com_owner.Initialize)
Define_Com Class(#Prim_nmbr) Name(#counter)

#STD_TEXT := ''

* Fill list with dummy data
Begin_Loop Using(#counter) To(10)
#STD_TEXTS := 'Box'
If (#counter <= 3)
#STD_TEXT := ('B&1').Substitute( #counter.AsString )
Else
#STD_TEXT := ''
Endif
#STD_TEXTL := ('Box #&1').Substitute( #counter.AsString )

Add_Entry To_List(#ListPackages)
End_Loop

#ListPackages.SetFocus()
Endroutine

Evtroutine Handling(#ListPackages.GotFocus)
#COM_OWNER.ReFocus
Endroutine

Evtroutine Handling(#ShortcutKey1.Pressed)
#COM_OWNER.ReFocus
Endroutine

Mthroutine Name(ReFocus)
* Give focus to first empty ListEdit element
Selectlist Named(#ListPackages)
If (#STD_TEXT = '')
#ListPackages.CurrentItem.Focus := True
Leave
Endif
Endselect
Endroutine
End_Com
If someone has other/better solutions, please let me know/