Customizing Appointments +

I have added the appointments + plugin to one of my client sites, http://www.foreverfitnessorlando.com/make-an-appointment/.

Right now I had to create instructions to tell people how to use it. Is there a way set up the shortcode do start the display with choosing the type of service, then then calendar is displayed based on what is selected?

  • nick_j_roy

    I want to be able to show the drop down list of services only and have the calendar show up only after the user selects the type of service. So Step 1 would be please select a service. Step 2 show calendar for user to select the day. Step 3 time slots show up to be selected. Step 4, the appointment form.

    Right now everything is shown.

    [app_services]
    <table>
    <tbody>
    <tr>
    <td colspan="2">[app_monthly_schedule]</td>
    </tr>
    <tr>
    <td colspan="2">[app_pagination month="1"]</td>
    </tr>
    <tr>
    <td colspan="2">[app_login]</td>
    </tr>
    <tr>
    <td colspan="2">[app_confirmation]</td>
    </tr>
    <tr>
    <td colspan="2">[app_paypal]</td>
    </tr>
    </tbody>
    </table>
  • aecnu

    Greetings nick_j_roy,

    Thank you for the clarification as well as the coding snippet which both are certainly appreciated.

    Though custom coding is beyond the scope of the support we provide here we do try to help if we can.

    With that said, I will see if I can get the lead developer in here with his invaluable insight into this plugin for his advice/advise for us.

    Though this may take a bit longer then a normal ticket, I will try to get him in here asap.

    Cheers, Joe

  • Hakan

    Hi,

    You can use jquery functions hide() and show() to hide and show the div wrappers as required. For example this will reveal service providers (which should have been hidden using display:none; css code) and hide services when someone clicks "show available times" button of services:

    $('.app_services_button').click(function(){
    $('.app_services').hide();
    $('.app_workers').show();
    });
    // Use the same logic for other steps

    Then you can add these codes to the appointments page using 'app_footer_scripts' filter hook. For example:

    function my_app_function( $script ) {
    $add = "$('.app_services_button').click(function(){
    $('.app_services').hide();
    $('.app_workers').show();
    });
    ";
    return  $add . $script;
    }
    add_filter( 'app_footer_scripts', 'my_app_function' );

    Note: Time slots and confirmation form are already working like this.

    Cheers,
    Hakan

  • aecnu

    Greetings nick_j_roy,

    With the lead developers input immediately above, it appears this particular topic is now resolved/closed, if you need any further assistance please let us know.

    If it wasn't resolved, or you have any more questions related to this thread, please feel free to post them below including any new symptoms or errors and tick the 'Mark as Not Resolved (re-open)' box below the post area (or else we'll miss it!)

    Thank you for being a WPMU Dev Community Member!

    Cheers, Joe

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.