Booking form fields can be customized and extended

[laander]

This enables customization of form fields (enabled, placeholder, prefilled, required) and adds three new types (phone, voip and location).

Fixes #16 and #10 and #9

See /examples/fields.htm for a full example of setting combination

These are the default settings:

bookingFields: {
  name: {
    placeholder: 'Your full name',
    prefilled: false
  },
  email: {
    placeholder: 'Your e-mail',
    prefilled: false
  },
  comment: {
    enabled: true,
    placeholder: 'Write a comment (optional)',
    prefilled: false,
    required: false
  },
  phone: {
    enabled: false,
    placeholder: 'Your phone number',
    prefilled: false,
    required: false
  },
  voip: {
    enabled: false,
    placeholder: 'Your Skype username',
    prefilled: false,
    required: false
  },
  location: {
    enabled: false,
    placeholder: 'Location',
    prefilled: false,
    required: false
  }
}

[fragmichdoch]

nice.

• am I able to control the order of those input fields?
• if an input field has been pre-filled then I'd loose the context. check out the floating labels for input fields for a better UX: http://bradfrost.com/blog/post/float-label-pattern/
• what about the location parameter. this will be a blank text field, right? have you thought about the i.e. google place autocomplete feature? https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform
• for mobile devices you might force the according keyboard type, too. i.e. in the telephone field it would trigger the numbers only keyboard etc.

[laander]

@fragmichdoch Good points, I've created separate feature requests for each.

• The order of the fields are fixed for now in order to keep implementation simple. Ability to specify order of the booking form fields #34
• Yeah, I've considered floating labels too. I'll probably look into it for a future release. Floating labels for inputs to enhance UX (especially with prefill) #35
• Yup, the location field could definitely benefit from a Google places autocomplete. It comes with some challenges though, in particular extra size overhead (20kb for the library) and the need for a Google API token (should it be customizable?) The location booking field should support Google places autocomplete #36
• Good point, the email field is already of type=email, I've added type=tel to the phone field too 👍