Skip to main content
Version: Upcoming 🦄

PhoneButton

The PhoneButton offers the possibility to dial a phone number provided by an input field inside your Form by a dial-up application i.e. "Skype" or the mobile device.

<div
    id="phoneButton1"
    class="pdf-hide"
    data-hf-control="PhoneButton"
    data-hf-options="{
        phoneId:'phone',
        buttonHeading: 'Customer',
        buttonLabel: 'Skype',
        buttonType: 'large' 
    }"
></div>

FormControl Options​

buttonType - required​

Define the size of the button ('small', 'medium' or 'large').
How to use:
buttonType: 'large'
Type: 'small' | 'medium' | 'large'

phoneId - required​

Provide the ID of the Form Control recieving the phone number.
How to use:
phoneId:'phone'
Type: string

buttonHeading​

Define a label for the control element.
How to use:
buttonHeading: 'Customer'
Type: string

buttonLabel​

Define the button caption.
How to use:
buttonLabel: 'Skype'
Type: string

buttonStyle​

Define the style of the button.
How to use:
buttonStyle: 'primary'
Type: 'default' | 'primary' | 'success' | 'error' | 'warning'

hidden​

Hide FormControl in Form.
How to use:
hidden: true
Type: boolean

icon​

Sets the icon of the button.
How to use:
icon: 'fa-barcode-scan'
Type: string

nextToField​

Define the Form Control the button should be placed next to. Looks like: this
How to use:
nextToField: 'phone_number'
Type: string