{"id":6614,"date":"2026-10-09T12:42:49","date_gmt":"2026-10-09T12:42:49","guid":{"rendered":"https:\/\/vzw-ithaka.be\/nl\/?page_id=6614"},"modified":"2026-10-09T12:44:07","modified_gmt":"2026-10-09T12:44:07","slug":"schol-reservatie","status":"publish","type":"page","link":"https:\/\/vzw-ithaka.be\/nl\/schol\/schol-reservatie\/","title":{"rendered":"Schol reservatie"},"content":{"rendered":"<div class=\"fusion-fullwidth fullwidth-box fusion-builder-row-1 fusion-flex-container has-pattern-background has-mask-background nonhundred-percent-fullwidth non-hundred-percent-height-scrolling\" style=\"--awb-border-radius-top-left:0px;--awb-border-radius-top-right:0px;--awb-border-radius-bottom-right:0px;--awb-border-radius-bottom-left:0px;--awb-flex-wrap:wrap;\" ><div class=\"fusion-builder-row fusion-row fusion-flex-align-items-flex-start fusion-flex-content-wrap\" style=\"max-width:1632.8px;margin-left: calc(-4% \/ 2 );margin-right: calc(-4% \/ 2 );\"><div class=\"fusion-layout-column fusion_builder_column fusion-builder-column-0 fusion_builder_column_1_1 1_1 fusion-flex-column\" style=\"--awb-bg-size:cover;--awb-width-large:100%;--awb-margin-top-large:0px;--awb-spacing-right-large:1.92%;--awb-margin-bottom-large:30px;--awb-spacing-left-large:1.92%;--awb-width-medium:100%;--awb-order-medium:0;--awb-spacing-right-medium:1.92%;--awb-spacing-left-medium:1.92%;--awb-width-small:100%;--awb-order-small:0;--awb-spacing-right-small:1.92%;--awb-spacing-left-small:1.92%;\"><div class=\"fusion-column-wrapper fusion-column-has-shadow fusion-flex-justify-content-flex-start fusion-content-layout-column\"><div class=\"fusion-text fusion-text-1\">    <style>\n        .schol-res-btn-trigger {\n            background-color: #2b5797;\n            color: #ffffff !important;\n            padding: 14px 28px;\n            border-radius: 30px;\n            font-size: 16px;\n            font-weight: 600;\n            text-decoration: none !important;\n            display: inline-block;\n            transition: all 0.2s ease;\n            cursor: pointer;\n            border: none;\n        }\n        .schol-res-btn-trigger:hover {\n            background-color: #1a3966;\n        }\n        .schol-res-card {\n            background: #ffffff;\n            border: 1px solid #e2e8f0;\n            border-radius: 12px;\n            padding: 30px;\n            max-width: 650px;\n            box-shadow: 0 4px 15px rgba(0,0,0,0.05);\n            margin: 20px 0;\n            font-family: inherit;\n        }\n        .schol-res-group {\n            margin-bottom: 18px;\n        }\n        .schol-res-group label {\n            display: block;\n            font-weight: 600;\n            margin-bottom: 6px;\n            color: #2d3748;\n        }\n        .schol-res-group input[type=\"text\"],\n        .schol-res-group input[type=\"email\"],\n        .schol-res-group input[type=\"tel\"],\n        .schol-res-group input[type=\"date\"],\n        .schol-res-group select,\n        .schol-res-group textarea {\n            width: 100%;\n            padding: 11px 14px;\n            border: 1px solid #cbd5e0;\n            border-radius: 6px;\n            box-sizing: border-box;\n            font-size: 15px;\n        }\n        .schol-res-badge-info {\n            background: #f8fafc;\n            border: 1px solid #e2e8f0;\n            color: #4a5568;\n            padding: 16px 18px;\n            border-radius: 8px;\n            margin-bottom: 22px;\n            font-size: 14px;\n            line-height: 1.7;\n        }\n        .schol-res-group-notice {\n            display: none;\n            background: #fffaf0;\n            border: 1px solid #feebc8;\n            color: #7b341e;\n            padding: 14px 16px;\n            border-radius: 6px;\n            margin-top: 10px;\n            font-size: 14px;\n            line-height: 1.5;\n        }\n        .schol-res-success-box {\n            display: none;\n            background-color: #def7ec;\n            color: #03543f;\n            border: 2px solid #84e1bc;\n            padding: 22px;\n            border-radius: 10px;\n            margin-top: 15px;\n            font-size: 16px;\n            line-height: 1.6;\n        }\n        .schol-res-error-box {\n            display: none;\n            background-color: #fde8e8;\n            color: #9b1c1c;\n            border: 1px solid #fbd5d5;\n            padding: 14px;\n            border-radius: 6px;\n            margin-top: 15px;\n            font-size: 15px;\n        }\n    <\/style>\n\n    <div class=\"schol-res-wrapper\" id=\"schol-res-main-wrapper\">\n        <div class=\"schol-res-card\">\n            <h3 style=\"margin-top:0; margin-bottom:15px; color:#2b5797; font-size:22px; font-weight:700;\">Tafel reserveren in Schol<\/h3>\n            \n            <div class=\"schol-res-badge-info\">\n                Openingsuren: maandag tot en met vrijdag van 10.00 tot 16.00 uur.<br>\n                Lunch tussen 11.00 en 14.00 uur.<br>\n                Koffie, taart en drankjes doorlopend van 10.00 tot 16.00 uur.\n            <\/div>\n\n            <!-- Grote duidelijke bevestigingsbox bij succes -->\n            <div class=\"schol-res-success-box\" id=\"schol-res-success-box\">\n                <h4 style=\"margin-top:0; color:#03543f; font-size:20px; font-weight:700; margin-bottom:8px;\">Reservatie geslaagd!<\/h4>\n                <div id=\"schol-res-success-message-content\"><\/div>\n                <div style=\"margin-top:20px;\">\n                    <button type=\"button\" class=\"button\" onclick=\"scholResetResForm()\" style=\"background:#03543f; color:#fff; border:none; padding:10px 20px; border-radius:20px; cursor:pointer; font-weight:600;\">Nog een reservatie maken<\/button>\n                <\/div>\n            <\/div>\n\n            <form id=\"schol-table-res-form\">\n                <input type=\"hidden\" name=\"action\" value=\"schol_submit_table_reservation\">\n                <input type=\"hidden\" id=\"security\" name=\"security\" value=\"22ba4930fd\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/nl\/wp-json\/wp\/v2\/pages\/6614\" \/>\n                <div class=\"schol-res-group\">\n                    <label>Waarvoor kom je langs? *<\/label>\n                    <select name=\"type_bezoek\" id=\"schol-res-type-bezoek\" required onchange=\"scholUpdateTijdOpties(this.value)\">\n                        <option value=\"Koffie, taart of drankje\" selected>Koffie, taart of drankje<\/option>\n                        <option value=\"Lunch\">Lunch<\/option>\n                    <\/select>\n                <\/div>\n\n                <div style=\"display:flex; gap:15px; flex-wrap:wrap;\">\n                    <div class=\"schol-res-group\" style=\"flex:1; min-width:240px;\">\n                        <label>Datum van bezoek *<\/label>\n                        <input type=\"date\" name=\"datum_bezoek\" id=\"schol-res-datum\" required min=\"2026-10-23\">\n                        <small style=\"color:#718096;\">Schol is open van maandag tot en met vrijdag.<\/small>\n                    <\/div>\n                    <div class=\"schol-res-group\" style=\"flex:1; min-width:240px;\">\n                        <label>Aankomstuur *<\/label>\n                        <select name=\"aankomstuur\" id=\"schol-res-aankomstuur\" required>\n                            <option value=\"\">-- Kies tijdstip --<\/option>\n                            <option value=\"10:00\">10:00 uur<\/option>\n                            <option value=\"10:30\">10:30 uur<\/option>\n                            <option value=\"11:00\">11:00 uur<\/option>\n                            <option value=\"11:30\">11:30 uur<\/option>\n                            <option value=\"12:00\">12:00 uur<\/option>\n                            <option value=\"12:30\">12:30 uur<\/option>\n                            <option value=\"13:00\">13:00 uur<\/option>\n                            <option value=\"13:30\">13:30 uur<\/option>\n                            <option value=\"14:00\">14:00 uur<\/option>\n                            <option value=\"14:30\">14:30 uur<\/option>\n                            <option value=\"15:00\">15:00 uur<\/option>\n                            <option value=\"15:30\">15:30 uur<\/option>\n                        <\/select>\n                    <\/div>\n                <\/div>\n\n                <div class=\"schol-res-group\">\n                    <label>Aantal personen *<\/label>\n                    <select name=\"aantal_personen\" id=\"schol-res-personen\" required onchange=\"scholCheckGroupSize(this.value)\">\n                        <option value=\"1\">1 persoon<\/option>\n                        <option value=\"2\" selected>2 personen<\/option>\n                        <option value=\"3\">3 personen<\/option>\n                        <option value=\"4\">4 personen<\/option>\n                        <option value=\"5\">5 personen<\/option>\n                        <option value=\"6\">6 personen<\/option>\n                        <option value=\"groep_groot\">Meer dan 6 personen...<\/option>\n                    <\/select>\n                <\/div>\n\n                <div class=\"schol-res-group-notice\" id=\"schol-group-notice\">\n                    <strong>Groepen groter dan 6 personen:<\/strong><br>\n                    Voor groepen van meer dan 6 personen vragen we om rechtstreeks contact op te nemen via mail naar <a href=\"mailto:schol@vzw-ithaka.be\" style=\"font-weight:bold; color:#7b341e;\">schol@vzw-ithaka.be<\/a> of telefonisch.\n                <\/div>\n\n                <div id=\"schol-form-fields-wrapper\">\n                    <div style=\"display:flex; gap:15px; flex-wrap:wrap;\">\n                        <div class=\"schol-res-group\" style=\"flex:1; min-width:240px;\">\n                            <label>Voornaam *<\/label>\n                            <input type=\"text\" name=\"voornaam\" required placeholder=\"Voornaam\">\n                        <\/div>\n                        <div class=\"schol-res-group\" style=\"flex:1; min-width:240px;\">\n                            <label>Achternaam *<\/label>\n                            <input type=\"text\" name=\"achternaam\" required placeholder=\"Achternaam\">\n                        <\/div>\n                    <\/div>\n\n                    <div style=\"display:flex; gap:15px; flex-wrap:wrap;\">\n                        <div class=\"schol-res-group\" style=\"flex:1; min-width:240px;\">\n                            <label>E-mailadres *<\/label>\n                            <input type=\"email\" name=\"email\" required placeholder=\"E-mailadres\">\n                        <\/div>\n                        <div class=\"schol-res-group\" style=\"flex:1; min-width:240px;\">\n                            <label>Telefoonnummer *<\/label>\n                            <input type=\"tel\" name=\"telefoon\" required placeholder=\"Telefoonnummer\">\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"schol-res-group\">\n                        <label>Extra info \/ dieetwensen \/ allergie\u00ebn<\/label>\n                        <textarea name=\"extra_info\" rows=\"3\" placeholder=\"Bijvoorbeeld vegetarisch, allergie\u00ebn, rolstoeltoegankelijke tafel...\"><\/textarea>\n                    <\/div>\n\n                    <div style=\"margin-top:25px;\">\n                        <button type=\"submit\" class=\"schol-res-btn-trigger\" id=\"schol-res-submit-btn\" style=\"width:100%;\">\n                            <span>Tafel reservatie sturen<\/span>\n                        <\/button>\n                    <\/div>\n                <\/div>\n\n                <div class=\"schol-res-error-box\" id=\"schol-res-error-box\"><\/div>\n            <\/form>\n        <\/div>\n    <\/div>\n\n    <script>\n    function scholUpdateTijdOpties(type) {\n        var $ = window.jQuery || jQuery;\n        var $select = $('#schol-res-aankomstuur');\n        var currentVal = $select.val();\n        $select.empty().append('<option value=\"\">-- Kies tijdstip --<\/option>');\n\n        var tijden = [];\n        if (type === 'Lunch') {\n            tijden = ['11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00'];\n        } else {\n            tijden = ['10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30'];\n        }\n\n        for (var i = 0; i < tijden.length; i++) {\n            var t = tijden[i];\n            var selected = (t === currentVal) ? ' selected' : '';\n            $select.append('<option value=\"' + t + '\"' + selected + '>' + t + ' uur<\/option>');\n        }\n    }\n\n    function scholCheckGroupSize(val) {\n        var $ = window.jQuery || jQuery;\n        if (val === 'groep_groot') {\n            $('#schol-group-notice').slideDown();\n            $('#schol-form-fields-wrapper').slideUp();\n        } else {\n            $('#schol-group-notice').slideUp();\n            $('#schol-form-fields-wrapper').slideDown();\n        }\n    }\n\n    function scholResetResForm() {\n        var $ = window.jQuery || jQuery;\n        $('#schol-table-res-form')[0].reset();\n        $('#schol-res-success-box').hide();\n        $('#schol-table-res-form').show();\n        $('#schol-res-submit-btn').prop('disabled', false).find('span').text('Tafel reservatie sturen');\n    }\n\n    \/\/ Blokkeer weekenden & specifieke sluitingsdagen\n    document.addEventListener('DOMContentLoaded', function() {\n        var dateInput = document.getElementById('schol-res-datum');\n        var disabledDates = [];\n        if (dateInput) {\n            dateInput.addEventListener('change', function() {\n                var val = this.value;\n                if (!val) return;\n                var dateObj = new Date(val);\n                var day = dateObj.getUTCDay();\n                if (day === 0 || day === 6) { \/\/ 0 = Zondag, 6 = Zaterdag\n                    alert('Schol is gesloten in het weekend. Kies alstublieft een datum van maandag tot en met vrijdag.');\n                    this.value = '';\n                    return;\n                }\n                \n                var y = dateObj.getFullYear();\n                var m = String(dateObj.getMonth() + 1).padStart(2, '0');\n                var d = String(dateObj.getDate()).padStart(2, '0');\n                var isoDate = y + '-' + m + '-' + d;\n                var euDate = d + '\/' + m + '\/' + y;\n\n                for (var i = 0; i < disabledDates.length; i++) {\n                    var disabled = disabledDates[i].trim();\n                    if (disabled === isoDate || disabled === euDate || disabled === val) {\n                        alert('Schol is uitzonderlijk gesloten op ' + euDate + '. Kies a.u.b. een andere datum.');\n                        this.value = '';\n                        return;\n                    }\n                }\n            });\n        }\n    });\n\n    jQuery(document).ready(function($) {\n        $('#schol-table-res-form').on('submit', function(e) {\n            e.preventDefault();\n            var $form = $(this);\n            var $btn = $('#schol-res-submit-btn');\n            var $err = $('#schol-res-error-box');\n\n            $btn.prop('disabled', true).find('span').text('Reservatie verwerken...');\n            $err.hide();\n\n            $.ajax({\n                url: 'https:\/\/vzw-ithaka.be\/nl\/wp-admin\/admin-ajax.php',\n                type: 'POST',\n                data: $form.serialize(),\n                dataType: 'json',\n                success: function(response) {\n                    if (response.success) {\n                        $('#schol-res-success-message-content').html(response.data.message);\n                        $form.hide();\n                        $('#schol-res-success-box').fadeIn();\n                        $('html, body').animate({ scrollTop: $('#schol-res-main-wrapper').offset().top - 100 }, 300);\n                    } else {\n                        $err.html(response.data.message).slideDown();\n                        $btn.prop('disabled', false).find('span').text('Tafel reservatie sturen');\n                    }\n                },\n                error: function() {\n                    $err.html('Netwerkfout. Probeer het opnieuw.').slideDown();\n                    $btn.prop('disabled', false).find('span').text('Tafel reservatie sturen');\n                }\n            });\n        });\n    });\n    <\/script>\n    \n<\/div><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":3140,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-6614","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/pages\/6614","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/comments?post=6614"}],"version-history":[{"count":2,"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/pages\/6614\/revisions"}],"predecessor-version":[{"id":6616,"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/pages\/6614\/revisions\/6616"}],"up":[{"embeddable":true,"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/pages\/3140"}],"wp:attachment":[{"href":"https:\/\/vzw-ithaka.be\/nl\/wp-json\/wp\/v2\/media?parent=6614"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}