v0.9

Form

class Form → file: core/lib/Form.js

With this library, developers can effortlessly manage HTML form field values, making it an efficient solution for handling user input in web applications.

Instance

Instance created with new Form(formName)

Properties

Methods

setControl(key, val) :void

Set the form element value attribute and DOM property. Set checked for RADIO and CHECKBOX or selected for SELECT element.

ARGUMENTS:
• key :string - the value of the "name" HTML attribute
• val :string - value

setControls(obj) :void

Set multiple form controls with one object.

ARGUMENTS:
• obj :object - the object which represent the object values, for example: {fullname:'John Doe', age:23, employed:true}
  NOTICE: If the obj has subproperty it can be used in the name, for example: const fruit = {seller: {name: 'Drog Ltd'}; this.testForm.setControls(fruit); will set element <input type="text" name="seller.name">

getControl(key, convertType=true) :string|any

Get the form control value. Returned value is single value or array of values for checkboxes and select-multiple.
NOTICE: If convertType is false the returned value is string, but when convertType is true the returned value can be of any converted type.

ARGUMENTS:
• key :string - the value of the "name" HTML attribute
• convertType :boolean - to convert the type, for example '5' to Number or '{"a": 22}' to Object. Default is true.

getControls(keys, convertType=true) :object

Get the form control values. Returned value is the corresponding object.

ARGUMENTS:
• keys :string[] - the values of the "name" HTML attributes (This is an JS Array!)
• convertType :boolean - to convert the type, for example '5' to Number or '{"a": 22}' to Object. Default is true.

getAllControls(convertType=true) :object

Get all form control values. Returned value is the corresponding object.

ARGUMENTS:
• convertType :boolean - to convert the type, for example '5' to Number or '{"a": 22}' to Object. Default is true.

delControl(key) :void

Empty the form control value.

ARGUMENTS:
• key :string - the value of the "name" HTML attribute

delControls(keys) :void

Empty the specific form controls.

ARGUMENTS:
• keys :string[] - the values of the "name" HTML attributes

delAllControls() :void

Empty the whole form including input,select and textarea form fields.

Example

        const { Controller, corelib } = require('@mikosoft/dodo');

        class MyCtrl extends Controller {
          constructor(app) {
            super();
          }

          async __init (trx) {
            this.myForm = new corelib.Form('myForm');
          }

          test() {
            const firstName = this.myForm.getControl('first_name');
            console.log(firstName)
          }

        }
          

        <form dd-form="myForm">
          <input type="text" name="first_name">
        </form>
          

Stackblitz Examples

• Form - test Form library methods