2022 April Release

JavaScript Template for a ControlPermanent link for this heading

To provide the implementation of a GUI control, the following JavaScript functions can be used.

Syntax

function jQuery<SWCREF>_<majorid>_<minorid>_<ControlName>()
{
  this.OnInit = function <ControlName>_OnInit()
  {
  };

  this.OnRender = function <ControlName>_OnRender(output)
  {
  };

  this.OnLoad = function <ControlName>_OnLoad()
  {
  };

  this.OnLayout = function <ControlName>_OnLayout(isinit)
  {
  };

  this.OnSubmit = function <ControlName>_OnSubmit(isinit)
  {
  };

  this.OnCleanup = function <ControlName>_OnCleanup()
  {
  };

  this.MyFunction = function <ControlName>_MyFunction()
  {
  };
}

Naming SchemePermanent link for this heading

Define a function with the following naming scheme: jQuery<SWCREF>_<majorid>_<minorid>_<ControlName>()

  • SWCREF
    The reference of the software component that provides the control. The reference is set when creating an app.ducx project.
  • majorid
    The major domain ID. The major domain ID is set when creating an app.ducx project.
  • minorid
    The minor domain ID. The minor domain ID is set when creating an app.ducx project.
  • ControlName
    An arbitrary name for the control.

Example: jQueryFSCCONTROLSAMPLE_1_3285_CustomIntegerControl

Predefined FunctionsPermanent link for this heading

Within the function described above you can provide implementations for OnInit, OnRender, OnLoad, OnLayout, OnCleanup and your own functions.

  • OnInit
    This function is called after the control object has been created.
  • OnRender
    This function is called when rendering the HTML page. The parameter output allows printing HTML tags.
  • OnLoad
    This function is called after the control HTML is written on the HTML page.
  • OnLayout
    This function is called after OnLoad is carried out and for each resize of the web browser window. The optional parameter isinit is true when OnLayout is called the first time. In case of a window resize, the parameter is false.
  • OnSubmit
    This function is called before the page is submitted. It is a suitable point to call this.SetValue() if you have not set the value during runtime.
  • OnCleanup
    This function is called when the dialog containing the control is closed.
  • GetTabTarget
    This function is called after a form was rendered. It has to return an element which should be focused.
    Default return value is this.Container().
  • Your own functions
    You can specify your own helper functions.

Predefined ObjectsPermanent link for this heading

Within the JavaScript implementation, the following two objects are available:

  • output
    Provides the function Push that can be used to write HTML tags.
    Example: output.Push("<h2>" + this.currvalue + "</h2>");
  • fscjq
    Allows to access the jQuery provided by the Fabasoft product. fscjq has to be used instead of the $ function.
    Example: fscjq("#" + this.GetContainerId() + " A")

Predefined AttributesPermanent link for this heading

Within the JavaScript implementation, the following attributes are available:

  • this.info
    Provides additional information on the instance of the control.
    • label
      A string containing the label of the form field.
    • labelid
      A string containing the ID of the DOM element of the label (only if the label for the form field is visible)
    • mustbedef
      A boolean holding the value true if the form field has to be defined.
  • this.config
    • ariarole
      The default value is "document". The role is used for the attribute aria-role on the DOM element containing the control.

Customization OptionsPermanent link for this heading

Within the JavaScript implementation, the following options can be set on the parent control:

  • this.parent.isfullsize = true
    In an overlay, the control will be rendered full-size (without any padding or margin)