Sheerpower®
A Guide to the Sheerpower Language
Previous Contents Index

PURPOSE:

KEY INPUT is used to input a keystroke from the user and stores the value of the key in the string variable specified.

DESCRIPTION:

Some applications require the use of special keys or keystroke level validation. The KEY INPUT statement is used for these applications.

KEY INPUT does not echo the key pressed, nor does it generate a line feed.

All the options available with the preceding "INPUT" statement are also available with KEY INPUT. KEY INPUT returns the following:

_back
_exit
_help
_terminator
_TERMINATOR returns control (Ctrl) characters in the format "CTRL/X". For example, if the user presses [Ctrl/G], _TERMINATOR returns "CTRL/G".

Example 8-52 _TERMINATOR System Function 

  key input 'Press a terminator' : z$ 
  print 
  print 'You pressed '; _terminator
  end
 
        
Press a terminator?            (User presses [CTRL/G]) 
You pressed CTRL/G

Chapter 9
Input Dialogbox - Creating GUI Forms with Sheerpower

9.1 INPUT DIALOGBOX Statement

FORMAT:


        INPUT DIALOGBOX str_exp[, DEFAULT str_exp]: str_var

EXAMPLE:

Example 9-1 INPUT DIALOGBOX 

  form$ = '<form>' 
  form$ = form$ + 'City: <input type=text name=city><br>' 
  form$ = form$ + 'State: <input type=text name=state>' 
  form$ = form$ + '</form>' 
  input dialogbox form$: response$ 
  end

When the program executes, Sheerpower displays the "City" field and a fill-in area where the user can fill in a city, followed by the "State" field and a fill-in area where the user can fill in a state. At the bottom of the form, the default form buttons are displayed: SUBMIT, EXIT, HELP and BACK.

PURPOSE:

INPUT DIALOGBOX presents the end user with simple to complex input forms.

DESCRIPTION:

INPUT DIALOGBOX is a very powerful feature of Sheerpower. INPUT DIALOGBOX provides the user with the power of HTML forms without using a web browser.

9.2 Parsing INPUT DIALOGBOX Results

When the user submits the form, the results entered are returned in the following format: 


  fieldname=result

The fieldname is what the name of each input field is given inside the form code: 


  <input type=text name=firstname>

If there are multiple fieldnames that contain user-entered results, the data is stored into a list separated by a chr$(26): 


  fieldname=result chr$(26) fieldname=result chr$(26) fieldname=result

Below is an example of how to parse the results of a submitted form:

Example 9-2 Parsing INPUT DIALOGBOX Results 

  myform$ = '<form>City <input type=text name=city  size=40><br>' + 
                  'State <input type=text name=state size=2></form>' 
 
  input dialogbox myform$: ans$ 
 
  for item = 1 to pieces(ans$, chr$(26)) 
    z0$ = piece$(ans$, item, chr$(26)) 
    varname$ = element$(z0$, 1, '=') 
    value$   = element$(z0$, 2, '=') 
    select case varname$ 
    case 'city' 
      print 'City was  : '; value$ 
    case 'state' 
      print 'State was : '; value$ 
    case else
      print 'Unknown: '; varname$ 
    end select
  next item 
  end

Type in a city and state, then click on [SUBMIT]. The results will be printed out to the SP4GL window as seen below:

9.3 INPUT DIALOGBOX Directives

There are 3 directives available for use with the INPUT DIALOGBOX statement. These directives are used as part of the default option.

The %ERROR directive places the focus on the erroneous field(s) and makes the field text red. Multiple %error directives can be used for multiple errors.

Example 9-3 %ERROR Directive 

  test$ = '<form>' 
  test$ = test$ + 'One <input name=one value="1"><br>' 
  test$ = test$ + 'Two <input name=two value="2"><br>' 
  test$ = test$ + 'Three <input name=three value="3"><br>' 
  test$ = test$ + 'Four <input name=four value="4">' 
  test$ = test$ + '</form>' 
  def$ = "%error=one"+chr$(26)+"%error=four"
  input dialogbox test$, default def$: answer$    
  end

The %FOCUS directive allows the focus to be placed on a selected field. Multiple %focus directives can be used if there are multiple fields to move focus to.

Example 9-4 %FOCUS Directive 

  test$ = '<form>' 
  test$ = test$ + 'One <input name=one value="1"><br>' 
  test$ = test$ + 'Two <input name=two value="2"><br>' 
  test$ = test$ + 'Three <input name=three value="3"><br>' 
  test$ = test$ + 'Four <input name=four value="4">' 
  test$ = test$ + '</form>' 
  def$ = "%focus=three" 
  input dialogbox test$, default def$: answer$    
  end

The %READONLY directive allows for fields to display data that cannot be changed by the end-user.

To specify multiple fields as "read-only" the chr$(26) separator must be included.

Example 9-5 %READONLY Directive 

  test$ = '<form>' 
  test$ = test$ + 'One <input name=one value="1"><br>' 
  test$ = test$ + 'Two <input name=two value="2"><br>' 
  test$ = test$ + 'Three <input name=three value="3"><br>' 
  test$ = test$ + 'Four <input name=four value="4">' 
  test$ = test$ + '</form>' 
  def$ = "%readonly=two"+chr$(26)+"%readonly=four"
  input dialogbox test$, default def$: answer$    
  end

9.4 Supported HTML Tags and Attributes

INPUT DIALOGBOX supports a subset of standard HTML tags along with dialogbox enhancements. For a complete listing of supported HTML tags refer to Appendix G, Input Dialogbox Supported HTML Tags.

9.4.1 Sheerpower Tag - <sheerpower>

The SHEERPOWER TAG is a powerful feature of INPUT DIALOGBOX. The Sheerpower tag allows you to change the size, color and title of a form as well as other attributes. In addition, the Sheerpower tag includes a TYPE attribute which specifies the type of dialog box to be presented. The different types are: HTML FORM (default), OPEN, SAVEAS, and SELECT.

When using the HTML form type the Sheerpower tag must be the first tag used before the FORM tag.

Example 9-6 <sheerpower > tag 

  form$ = '<sheerpower color=red height=500 width=500>' 
  form$ = form$ + '<form>' 
  form$ = form$ + 'Name <input type=text name=name><br>' 
  form$ = form$ + 'Address <input type=text name=address><br>' 
  form$ = form$ + 'City <input type=text name=city><br>' 
  form$ = form$ + 'State <input type=text name=state><br>' 
  form$ = form$ + 'Country <input type=text name=country><br>' 
  form$ = form$ + '</form>' 
  input dialogbox form$: results$ 
  
  for item = 1 to pieces(results$, chr$(26)) 
    z0$ = piece$(results$, item, chr$(26)) 
    varname$ = element$(z0$, 1, '=') 
    value$   = element$(z0$, 2, '=') 
    select case varname$ 
    case 'name' 
      print 'Name: '; value$ 
    case 'address' 
      print 'Address: '; value$ 
    case 'city' 
      print 'City: '; value$ 
    case 'state' 
      print 'State: '; value$ 
    case 'country' 
      print 'Country: '; value$ 
    case else
      print '??: '; varname$       
    end select
  next item   
  end

Sheerpower Tag Attributes

Table 9-1 SHEERPOWER Tag Attributes
Attribute Function
color specify the background color of the form
background specify a .JPG image to be used for the form background
title specify the title of the form
height specify the height of the form (in pixels)
width specify the width of the form (in pixels)
src specifies location of a URL or local file to grab HTML form tag code from (URL must contain only form HTML code)
persist keeps background canvas, text and images in place when form autosubmits (no blinking screen)
autosubmit automatically submits form after specified seconds of inactivity
type (HTML form/open/saveas/select) opens the Open, Saveas or Select dialogbox
attached causes the resulting dialogbox window to be "attached" to the Console window (when there is some console output). If the Console window is minimized or restored, the attached dialogbox window will minimize or be restored with it.

Previous Next Contents Index