CustomFormField
    • 1 Minute to read
    • Dark
      Light

    CustomFormField

    • Dark
      Light

    Article summary

    You can create a custom form field and use it for tracking if you are using form fields on your page that are not created by using the html tag "<input>".

    Class

    constructor

    Create an instance of the class "CustomFormField" and pass name and value which should be tracked. Pass the custom form field to a CustomForm to track it.

    /**
     * @param {string} name
     * @param {string} [value]
     *
     * @constructor
     */
    wtSmart.extension.form.CustomFormField(name, value);

    setAttribute

    Set an attribute.

    /**
     * @param {string} key
     * @param {string} value
     */
    customFormFieldInstance.setAttribute(key, value);

    getAttribute

    Get an attribute value.

    /**
     * @param {string} key
     *
     * @returns {string}
     */
    customFormFieldInstance.getAttribute(key);

    focus

    Change the internal form field status to "focused".

    customFormFieldInstance.focus();

    blur

    Change the internal form field status to "blurred".

    customFormFieldInstance.blur();

    addEventListener

    /**
     * @param {string} evt
     * @param {function} func
     */
    customFormFieldInstance.addEventListener(evt, func);

    removeEventListener

    /**
     * @param {string} evt
     */
    customFormFieldInstance.removeEventListener(evt);

    Example

    // create a custom form field
    var customFormFieldInstance = new wtSmart.extension.form.CustomFormField(
        'custom form field name'
    );
    
    // set an attribute
    customFormFieldInstance.setAttribute('foo', 'bar');
    
    // get an attribute
    var attribute = customFormFieldInstance.getAttribute('foo');
    
    // change the internal form field status to 'focused'
    customFormFieldInstance.focus();
    
    // change the internal form field status to 'blurred'
    customFormFieldInstance.blur();
    
    // add event listener
    customFormFieldInstance.addEventListener('focus', function() {
        console.log('custom form field was focused');
    });
    
    // remove all event listener
    customFormFieldInstance.removeEventListener('focus');


    Was this article helpful?