• Resolved eastbank

    (@eastbank)


    Hello,

    Great plugin, I’m hoping it can be perfect…..is there some way I can display the booking data that is shown in the admin on a frontend page?

    We want faculty members to be able to see who’s scheduled to come in at what time without having to log into the wordpress admin.

    So the frontend would display something like:

    January 1, 2017 – 2pm – John Doe
    January 3, 2017 – 1:30pm – Jane Doe

    https://wordpress.org/plugins/booking/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author wpdevelop

    (@wpdevelop)

    Hello.
    In actual versions of plugin, the “Calendar Overview” mode at admin panel exist only in back-end side. Its does not possible such view at front-end side. But we are working on next major update 7.0, which will support this mode at front-end side also.

    By the way you can make a little fix to show the name who made booking of SPECIFIC TIME-SLOT in usual inline month view calendar, when visitor mouse over specific day. Please read more about this here: http://wpbookingcalendar.com/support/comment-page-42/#comment-12606
    Kind Regards.

    Thread Starter eastbank

    (@eastbank)

    Thank you, after using the little fix to get the info to show up in popups I was able to make my own solution with javascript.

    Incase anyone else is interested, I’ll post my code. It should be noted that I’ve only given a single option for time slots on my booking calendar so only one appointment can be listed per day. This solution would probably need some tweaking if there were multiple listings in a single calendar day.

    To make sure that all possibly scheduled dates get pulled into my generated list, I had to set the booking calendar shortcode to display 12 months at a time.

    $(window).load(function(){
    
               // add a list element to the page
                $('article').prepend('<ul id="scheduleList"></ul>');
    
               // run the hover function here to get the user name/time data loaded into the page
                $('td.date_approved').mouseover();
    
               // get data from each approved calendar day
                  $('td.date_approved').each( function(){
                     var dateClasses = $(this).attr("class").split(' ');
                     var trimScript = $(this).attr('onmouseover');
                     var bookingID = trimScript.slice(54,-1);
                     var dateTrimmed = dateClasses[3].substring(9);
                     var userInfo = $(this).attr('data-content').slice(156,-13);
    
                 // build list item from collected data
                    var list = '<li><span class="booked-date">' + dateTrimmed + '</span> - ' + userInfo + '</li>'
    
                     // add list item to our list
                     $('#scheduleList').append(list);
                })
            });

    That then displays a list that looks like this:

    7-8-2016 – User Name
    7-26-2016 – User Name
    12-8-2016 – User Name

    I then hid the actual booking calendar on the page with CSS so only my generated list is displayed.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Display booking schedule on frontend page’ is closed to new replies.