BBjWindow::addEditBox

Description

Creates an edit box control in the BBjWindow.

Syntax

Return Value	Method
BBjEditBox	addEditBox(int ID, number x, number y, number w, number h, string title)
BBjEditBox	addEditBox(int ID, number x, number y, number w, number h, string title, string flags)
BBjEditBox	addEditBox(int ID, number x, number y, number w, number h, string title, string flags, string type)
BBjEditBox	addEditBox(int ID, string title)
BBjEditBox	addEditBox(int ID, string title, string flags)
BBjEditBox	addEditBox(int ID, string title, string flags, string type)
BBjEditBox	addEditBox(string title)
BBjEditBox	addEditBox(string title, string flags)
BBjEditBox	addEditBox(string title, string flags, string type)

Parameters

Variable

Description

Control ID number. It must be an integer between 1 and 32767 and be unique within a given top-level window.

Horizontal position of the upper-left corner of the control in current units.

Vertical position of the upper-left corner of the control in current units.

width

Width of the control in current units.

height

Height of the control in current units.

title

Title of the control. Including the '&' before a character in the title causes it to be an accelerator.

flags

Control flags, as follows:

Flag	Description
$0000$	Left justifies edit text (default).
$0001$	Causes the control to be initially disabled.
$0010$	Causes the control to be initially invisible.
$0020$	Designates the control to be part of a keyboard navigation group.
$0100$	Passes the `Home` and `Delete` keys as Keypress Notify events.
$0200$	Defines the edit text as read-only.
$0400$	Replaces input text with asterisks for a masked password.
$0800$	Draws a recessed client edge around the control.
$1000$	Draws a raised edge around the control.
$4000$	Centers edit text.
$8000$	Right justifies edit text.

type

In BBj 15.00 and above, the optional type parameter specifies a particular HTML5 input element style. This is only meaningful in BUI, and availability is determined by the browser. When running in GUI, or when running in a browser that doesn't support a particular type, this is assumed to be "text", a simple text edit control. Use BBjEditBox::getEditType to determine the actual generated control type.

Input Type	Description
text	Specifies the default type for all non-password edit boxes.
color	Specifies a color picker. Color values are specified in the format '#rrggbb' (e.g. '#ffff00' = yellow).
date	Specifies a date picker. Date values are specified in the format 'YYYY-MM-DD' (BBx date format %Yl-%Mz-%Dz). December 31, 2015 would be '2015-12-31'.
datetime-local	A date/time picker. Date/time values are specified in the format 'YYYY-MM-DDTHH:mm' (BBx date/time format %Yl-%Mz-%DzT%Hz:%mz) or 'YYYY-MM-DDTHH:mm:ss' (BBx date/time format %Yl-%Mz-%DzT%Hz:%mz:%sz). December 31, 2015 at 11:59:59pm would typically be '2015-12-31T23:59' or '2015-12-31T23:59:00'. Some browsers return time values with millisecond precision as a decimal value after the seconds.
email	Specifies that this input field is expected to contain an email address. Mobile browsers may optimize input for email addresses, e.g. by generating a different soft keyboard.
month	Specifies a month picker. Month values are specified in the format 'YYYY-MM' (BBx date format %Yl-%Mz). December 31, 2015 would be '2015-12'.
number	Specifies numeric input. Mobile browsers may optimize for numeric entry, e.g. by generating a different soft keyboard.
range	Specifies a slider control with a default range of 0..100.
search	Specifies a search box. Browsers may adjust the formatting as a hint to the user.
tel	Specifies that this input field is expected to contain a phone number. Mobile browsers may optimize input for phone numbers, e.g. by generating a different soft keyboard.
time	A time picker. Time values are specified in the format 'HH:mm' (BBx date format %Hz:%mz) or 'HH:mm:ss' (BBx date format %Hz:%mz:%sz). 11:59pm would typically be " 23:59 '' or " 23:59:00". Some browsers return time values with millisecond precision as a decimal value after the seconds.
url	Specifies that this input field is expected to contain a URL. Mobile browsers may optimize input for URLs, e.g. by generating a different soft keyboard.
week	Specifies a week picker. Week values are specified in the format 'YYYY-Www' (BBx date format %Yl-W%wz). December 31, 2015 would be '2015-W53'.

Return Value

Returns the created BBjEditBox object.

Remarks

If the ID parameter is not specified, a control ID is assigned dynamically using getAvailableControlID().

If the x, y, width, and height parameters are not specified, they are all initialized to 0. This is typically for use with DWC windows that dynamically arrange their contents (window creation flag $00100000$).

Example 1

rem 'Add a edit box to a window

rem 'Obtain the instance of the BBjAPI object
let myAPI!=BBjAPI()

rem 'Open the SysGui device
SYSGUI=UNT
OPEN (SYSGUI) "X0"

rem 'Obtain the instance of the BBjSysGui object
let mySysGui!=myAPI!.getSysGui()

rem 'Set addWindow param values
X=10
Y=10
WIDTH=200
HEIGHT=200
TITLE$="BBj Window"

rem 'Set the current context
mySysGui!.setContext(0)

rem 'Create a window
myWindow! = mySysGui!.addWindow(X,Y,WIDTH,HEIGHT,TITLE$)

rem 'Add a edit box on the window
myEditBox! = myWindow!.addEditBox(101,50,100,90,30,"",$0008$)

rem 'Register the CALLBACK routines
CALLBACK(ON_EDIT_MODIFY,EDIT_BOX_MODIFIED,mySysGui!.getContext(),myEditBox!.getID())
CALLBACK(ON_CLOSE,APP_CLOSE,mySysGui!.getContext())

rem 'Process Events
process_events

rem 'Callback routine called when the contents of the Edit Box are modified
EDIT_BOX_MODIFIED:
    rem 'Display a message with the edit box contents
    MESSAGE$="The edit box contents are: " + STR(myEditBox!.getText())
    let X=MSGBOX(MESSAGE$)
return

rem 'Callback routine called when the user closes the application window
APP_CLOSE:
release

Example 2

sysgui = unt
open (sysgui)"X0"
sysgui! = bbjapi().getSysGui()
window! = sysgui!.addWindow(50,50,300,550,"Window",$00090003$)
window!.setCallback(window!.ON_CLOSE,"eoj")
status! = window!.addStatusBar(100)
data "text","color","date","datetime-local","email","month"
data "number","range","search","tel","time","url","week"
i = 101, x = 100, y = 25, w = 175, h = 25
tbutton! = window!.addToolButton(1,x,y,w,h,"getText",$$)
tbutton!.setCallback(tbutton!.ON_TOOL_BUTTON_PUSH,"getText")
while 1
    dread type$,err=*break
    y = y + h + 10
    window!.addStaticText(i+100,0,y+5,90,h,type$,$8000$)
    editbox! = window!.addEditBox(i,x,y,w,h,"",$$,type$)
    if (type$ = "text") then
        editbox!.setText("The quick brown fox jumps over the lazy dog.")
    endif
    if (type$="color") then
        color$ = "#" + hta(chr(rnd(255))) + hta(chr(rnd(255))) + hta(chr(rnd(255)))
        editbox!.setText(color$)
    endif
    if (type$="date") then
        mask$ = "%Yl-%Mz-%Dz"
        editbox!.setText(date(0:mask$))
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
        editbox!.setAttribute("min",date(jul(0,0,0)-365:mask$))
        editbox!.setAttribute("max",date(jul(0,0,0)+365:mask$))
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
    endif
    if (type$="datetime-local") then
        mask$="%Yl-%Mz-%DzT%Hz:%mz"
        editbox!.setText(date(0:mask$))
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
        editbox!.setAttribute("min",date(jul(0,0,0)-365:mask$))
        editbox!.setAttribute("max",date(jul(0,0,0)+365:mask$))
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
    endif
    if (type$="month") then
        mask$="%Yl-%Mz"
        editbox!.setText(date(0:mask$))
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
        editbox!.setAttribute("min",date(jul(0,0,0)-365:mask$))
        editbox!.setAttribute("max",date(jul(0,0,0)+365:mask$))
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
    endif
    if (type$="number") then
        editbox!.setText(str(50))
        editbox!.setAlignment(editbox!.ALIGN_RIGHT)
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
        editbox!.setAttribute("min","-100")
        editbox!.setAttribute("max","100")
        editbox!.setAttribute("step","any")
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
    endif
    if (type$="range") then
        editbox!.setText(str(50))
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
        editbox!.setAttribute("min","-100")
        editbox!.setAttribute("max","100")
        print "min=",editbox!.getAttribute("min"),",max=",editbox!.getAttribute("max")
    endif
    if (type$="time") then
        mask$="%Hz:%mz"
        editbox!.setText(date(0:mask$))
    endif
    if (type$="week") then
        mask$="%Yl-W%Wz"
        editbox!.setText(date(0:mask$))
    endif
    editbox!.setName(type$)
    editbox!.setAttribute("placeholder","placeholder text goes here")
    editbox!.setToolTipText(editbox!.getEditType())
    editbox!.setCallback(editbox!.ON_EDIT_MODIFY,"modify")
    i = i + 1
wend
process_events

eoj:
release

getText:
    control! = window!.getFocusedControl()
    i = msgbox(control!.getText(err=*next),0,control!.getName(err=*next))
return

modify:
    event! = sysgui!.getLastEvent()
    editbox! = event!.getControl()
    event$ = editbox!.getName()+" = '"+event!.getText()+"'"
    status!.setText(event$)
    print event$
return

BBjWindow::addEditBox

Description

Syntax

Parameters

Return Value

Remarks

Example 1

Example 2

See Also