How can I create a multiple appointment form?

  • bisspuxi
    Asked on September 19, 2017 at 11:34 PM

    Hi

    I'd like to create an appointment form for 5-8 different people but all on the same form. I'm trying to create a teacher/parent evening appointment form so a parent can see the available booking slots for 5-8 different teachers, choose an available time slot for each teacher and then click submit. 

    Is this possible? I've created for one teacher but I don't want to create one for each teacher. I'm trying to avoid having a parent view each individual booking form, selecting time slot, submitting and repeating process for 5-8 different teachers.

    Kind thanks for any advice and solution.

  • BJoanna
    Replied on September 20, 2017 at 1:57 AM

    The form you provided currently has appointments for two teachers. You can add the additional appointments for other teachers the same way, using the Section Collapse fields and Appointment Slots widgets. 

    I would only recommend you to move the submit button to the bottom of the form and add it inside of another Section Collapse field, that will be set to like this.

    How can I create a multiple appointment form? Image 1 Screenshot 20

    This way the submit button will always be visible on the form.

    Here is my demo form: https://form.jotformpro.com/72620941598969 

    Feel free to test it and clone it

    Feel free to contact us if you have any other questions. 

  • bisspuxi
    Replied on September 20, 2017 at 7:56 AM

    Hi Joanna

    This is great and looks good... just what I needed. Thanks.

    I'm trying to troubleshoot issues parents may have using the form and it occurred to me they may want to see all available slots in one glance - in a table format, so they can see who is available when without having to open up each separate accordion. 

    It'll be hard for them to book an appointment with each individual teacher if they can't see all the options - they may double book themselves as teachers will all be available in the same time period.

    Do you think it could be put in a table format? The teachers down one side, the times down another and the check boxes and availability filling the table?

    I've already cloned the form and desperately tried to achieve this but with no success.

    Thanks for your help and any suggestions.

    Richard

  • bisspuxi
    Replied on September 20, 2017 at 8:05 AM

    Hi

    This is my link to what I have now with additional teachers added...

    https://form.jotform.us/72610575002143

  • BJoanna
    Replied on September 20, 2017 at 10:14 AM

    You cloud use the Input Table field, but you will not be able to disable previously selected option. 

    How can I create a multiple appointment form? Image 1 Screenshot 20

    Maybe something like this work for you: https://form.jotformpro.com/72624032398962 

    I increased the width of the form to 1600px, so that 4 Appointment slots widget can fit in the same row and I also shrink all widget fields. I also removed Section Collapse fields form the form. 

    The Importance of Form Widths

    Form Field Positioning

    Hope this will help.

  • bisspuxi
    Replied on September 21, 2017 at 1:30 AM

    Thanks - this does look good.

    Is there a way to make it responsive. I'm copying the complete source code into my Wordpress theme (see link below) but the width means it heads off the page and is not responsive (as a number of our customers will view this on an ipad or mobile device.

    http://portal.bisspuxi.com/consultation-test/

    I've copied the entire source code into the page as we are based in China and if I just use the link to embed the form it is very slow and users report that the page will not load. I've just discovered the embed source code function and I'm keen to use it but whenever I copy code into the wordpress page it doesn't display in the correct way.

    Thanks for your patience.

  • bisspuxi
    Replied on September 21, 2017 at 1:36 AM

    Hi

    Also, when I clone the form it only displays two of the time options although all are showing in the widget settings. The clone is below. I've opened in edit mode but the settings tell me all the times are there... thanks.

    https://form.jotform.us/72631072002138

  • bisspuxi
    Replied on September 21, 2017 at 1:39 AM

    Hi

    Sorry, I solve the two times only showing - the height had defaulted to 100... I've set to 700 and it shows as in your example. Just the responsive and Wordpress issue to look at... cheers.

  • bisspuxi
    Replied on September 21, 2017 at 1:48 AM

    Hi

    I'm testing the page and form now - when I embed the entire source code into the site page on Wordpress, does this mean the availability won't be updated live...? I can see the submissions coming in but when I refresh the form page is still says when is available in time slots I've already chosen.

    Thanks 

  • BJoanna
    Replied on September 21, 2017 at 2:07 AM

    Considering that your other questions are not related to the subject of this thread, I have moved them to the separate thread and we will provide you an answers there shortly:

    https://www.jotform.com/answers/1253509 

    https://www.jotform.com/answers/1253510 

    Regrading the two times only showing issue - You can also resolve it by updating the widgets on your cloned form.