examples/fields.htm

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>Booking.js custom booking fields example</title>
  <style type="text/css">
    body { background-color: #E6E6E6; max-width: 700px; margin: 0 auto; }
  </style>
 </head>
 <body>

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  <script type="text/javascript" src="../dist/booking.js"></script>
  <div id="bookingjs">
    <script type="text/javascript">
      TimekitBooking().init({
        name:     'Doc Brown',
        email:    'marty.mcfly@timekit.io',
        apiToken: 'XT1JO879JF1qUXXzmETD5ucgxaDwsFsd',
        calendar: '22f86f0c-ee80-470c-95e8-dadd9d05edd2',
        avatar:   '../misc/avatar-doc.jpg',
        timekitConfig: {
          app: 'bookingjs-demo'
        },
        bookingFields: {
          name: {
            placeholder: 'Your name please'
          },
          email: {
            prefilled: 'doc.brown@timekit.io',
            disabled: true
          },
          comment: {
            enabled: true,
            prefilled: 'This is a comment'
          },
          phone: {
            enabled: true,
            required: true
          },
          voip: {
            enabled: true,
            prefilled: 'doc.brown',
            required: true,
            locked: true
          },
          location: {
            enabled: true,
            placeholder: 'Place of meeting'
          }
        }
      });
    </script>
  </div>

</body>
</html>