{"id":37,"date":"2024-09-19T17:29:03","date_gmt":"2024-09-19T17:29:03","guid":{"rendered":"https:\/\/daacad.nl\/?page_id=37"},"modified":"2024-09-29T14:16:28","modified_gmt":"2024-09-29T14:16:28","slug":"taxi-online-reserveren","status":"publish","type":"page","link":"https:\/\/daacad.nl\/?page_id=37","title":{"rendered":"Online Reserveren"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"nl\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Taxi Diensten Rotterdam<\/title>\n    <style>\n        body {\n            font-family: Arial, sans-serif;\n            margin: 0;\n            padding: 0;\n            color: #333;\n            background-color: #f9f9f9;\n        }\n        .container {\n            width: 90%;\n            max-width: 800px;\n            margin: auto;\n            padding: 20px;\n            background: #fff;\n            border-radius: 8px;\n            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n        }\n        .contact-form {\n            margin-top: 20px;\n        }\n        .contact-form h2 {\n            color: #333;\n            font-size: 24px;\n            margin-bottom: 20px;\n        }\n        .contact-form label {\n            display: block;\n            margin: 10px 0 5px;\n            font-size: 16px;\n        }\n        .contact-form input,\n        .contact-form textarea,\n        .contact-form select {\n            width: 100%;\n            padding: 10px;\n            margin-bottom: 10px;\n            border: 1px solid #ddd;\n            border-radius: 5px;\n            box-sizing: border-box;\n        }\n        .contact-form button {\n            display: inline-block;\n            padding: 20px 40px;\n            background: #ffcc00;\n            color: #000;\n            border: none;\n            border-radius: 5px;\n            font-size: 20px;\n            cursor: pointer;\n            transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;\n        }\n        .contact-form button:hover,\n        .contact-form button:focus {\n            background: #ffaa00;\n            transform: scale(1.05);\n            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);\n        }\n        .confirmation {\n            display: none;\n            background-color: #dff0d8;\n            color: #3c763d;\n            padding: 10px;\n            border: 1px solid #d6e9c6;\n            border-radius: 5px;\n            margin-top: 20px;\n            text-align: center;\n        }\n        .form-row {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 10px;\n        }\n        .form-row > div {\n            flex: 1;\n        }\n        .disclaimer {\n            font-size: 12px;\n            color: #666;\n            margin-top: -8px;\n        }\n        .hidden {\n            display: none;\n        }\n        .small-note {\n            font-size: 12px;\n            color: #666;\n        }\n        .error-message {\n            color: red;\n            font-size: 14px;\n            display: none;\n            margin-bottom: 10px;\n        }\n    <\/style>\n\n    <script>\n        function toggleKidInfo() {\n            const hasKids = document.getElementById('hasKids').value;\n            const kidInfoSection = document.getElementById('kidInfoSection');\n            \n            if (hasKids === \"yes\") {\n                kidInfoSection.classList.remove('hidden');\n            } else {\n                kidInfoSection.classList.add('hidden');\n                document.getElementById('numberOfKids').value = ''; \/\/ Clear number of kids\n                document.getElementById('kidInfoDetails').classList.add('hidden'); \/\/ Hide kid details\n                document.getElementById('errorMessage').style.display = 'none'; \/\/ Hide error\n            }\n            checkPassengerLimit(); \/\/ Re-check the passenger limit when toggling\n        }\n\n        function toggleKidDetails() {\n            const numberOfKids = parseInt(document.getElementById('numberOfKids').value, 10);\n            const kidInfoDetails = document.getElementById('kidInfoDetails');\n            \n            if (numberOfKids > 0) {\n                kidInfoDetails.classList.remove('hidden');\n            } else {\n                kidInfoDetails.classList.add('hidden');\n            }\n            checkPassengerLimit(); \/\/ Check the passenger limit when the number of kids is entered\n        }\n\n        function checkPassengerLimit() {\n            const numberOfPeople = parseInt(document.getElementById('numberOfPeople').value, 10);\n            const numberOfKids = parseInt(document.getElementById('numberOfKids').value || 0, 10);\n            const totalPassengers = numberOfPeople + numberOfKids;\n            const errorMessage = document.getElementById('errorMessage');\n            \n            if (totalPassengers > 4) {\n                errorMessage.style.display = 'block';\n            } else {\n                errorMessage.style.display = 'none';\n            }\n        }\n\n        function sendToWhatsApp(event) {\n            event.preventDefault(); \/\/ Prevent form submission\n\n            const name = encodeURIComponent(document.getElementById('name').value);\n            const email = encodeURIComponent(document.getElementById('email').value);\n            const phone = encodeURIComponent(document.getElementById('phone').value);\n            const pickupAddress = encodeURIComponent(document.getElementById('pickupAddress').value);\n            const destinationAddress = encodeURIComponent(document.getElementById('destinationAddress').value);\n            const time = encodeURIComponent(document.getElementById('time').value);\n            const date = encodeURIComponent(document.getElementById('date').value);\n            const numberOfPeople = encodeURIComponent(document.getElementById('numberOfPeople').value);\n            const hasKids = encodeURIComponent(document.getElementById('hasKids').value);\n            let kidDetails = '';\n\n            const totalPassengers = parseInt(numberOfPeople, 10) + parseInt(document.getElementById('numberOfKids').value || 0, 10);\n\n            \/\/ Validate total passengers\n            if (totalPassengers > 4) {\n                alert(\"Het totaal aantal passagiers mag niet meer dan 4 zijn (inclusief kinderen).\");\n                return false;\n            }\n\n            \/\/ Collect children details if applicable\n            if (hasKids === \"yes\") {\n                const numberOfKids = encodeURIComponent(document.getElementById('numberOfKids').value);\n                const kidName = encodeURIComponent(document.getElementById('kidName').value);\n                const kidAge = encodeURIComponent(document.getElementById('kidAge').value);\n                const kidHeight = encodeURIComponent(document.getElementById('kidHeight').value);\n                kidDetails = `Aantal kinderen: ${numberOfKids}%0A` +\n                             `Kind(eren) naam: ${kidName}%0A` +\n                             `Kind(eren) leeftijd: ${kidAge}%0A` +\n                             `Kind(eren) lengte: ${kidHeight} meter%0A`;\n            }\n\n            const comment = encodeURIComponent(document.getElementById('comment').value);\n            const copy = document.getElementById('copy').checked ? 'Ja' : 'Nee';\n\n            \/\/ Create route link for Google Maps\n            const routeUrl = `https:\/\/www.google.com\/maps\/dir\/?api=1&origin=${pickupAddress}&destination=${destinationAddress}`;\n\n            \/\/ Create Google Maps pin for pickup address\n            const pickupPinUrl = `https:\/\/www.google.com\/maps\/search\/?api=1&query=${pickupAddress}`;\n\n            \/\/ Create message text for WhatsApp\n            const message = `Naam: ${name}%0A` +\n                            `E-mail: ${email}%0A` +\n                            `Telefoonnummer: ${phone}%0A` +\n                            `Ophaaladres: ${pickupAddress}%0A` +\n                            `Bestemmings adres: ${destinationAddress}%0A` +\n                            `Tijd: ${time}%0A` +\n                            `Datum: ${date}%0A` +\n                            `Aantal personen: ${numberOfPeople}%0A` +\n                            `Heeft u kinderen: ${hasKids}%0A` +\n                            kidDetails +\n                            `Opmerking: ${comment}%0A` +\n                            `Stuur mij een kopie: ${copy}%0A%0A` +\n                            `Hier is de route van het ophaaladres naar het bestemmingsadres: ${routeUrl}%0A` +\n                            `Pin van het ophaaladres: ${pickupPinUrl}%0A` +\n                            `Let op: Controleer alstublieft het ophaaladres om te zorgen dat het de exacte locatie van de klant is.`;\n\n            const whatsappUrl = `https:\/\/wa.me\/31685863547?text=${message}`;\n\n            \/\/ Debugging logs\n            console.log(\"Opening WhatsApp with URL:\", whatsappUrl);\n\n            \/\/ Open WhatsApp link in new tab\n            window.open(whatsappUrl, '_blank');\n\n            \/\/ Show confirmation message after the link opens\n            document.getElementById('confirmationMessage').style.display = 'block';\n            document.getElementById('bookingForm').reset(); \/\/ Reset the form\n            return false; \/\/ Prevent form submission\n        }\n    <\/script>\n<\/head>\n<body>\n    <div class=\"container\">\n        <div class=\"contact-form\">\n            <h2>Vraag een rit aan<\/h2>\n            <form id=\"bookingForm\" onsubmit=\"sendToWhatsApp(event);\">\n                <label for=\"name\">Naam: *<\/label>\n                <input type=\"text\" id=\"name\" name=\"name\" required>\n\n                <label for=\"email\">E-mail: *<\/label>\n                <input type=\"email\" id=\"email\" name=\"email\" required>\n\n                <label for=\"phone\">Telefoonnummer: *<\/label>\n                <input type=\"tel\" id=\"phone\" name=\"phone\" required>\n\n                <label for=\"pickupAddress\">Ophaaladres: *<\/label>\n                <input type=\"text\" id=\"pickupAddress\" name=\"pickupAddress\" required>\n\n                <label for=\"destinationAddress\">Bestemmings adres: *<\/label>\n                <input type=\"text\" id=\"destinationAddress\" name=\"destinationAddress\" required>\n\n                <label for=\"time\">Tijd: *<\/label>\n                <input type=\"time\" id=\"time\" name=\"time\" required>\n\n                <label for=\"date\">Datum: *<\/label>\n                <input type=\"date\" id=\"date\" name=\"date\" required>\n\n                <label for=\"numberOfPeople\">Aantal personen (exclusief kinderen): *<\/label>\n                <input type=\"number\" id=\"numberOfPeople\" name=\"numberOfPeople\" min=\"1\" max=\"4\" value=\"1\" onchange=\"checkPassengerLimit()\" required>\n\n                <label for=\"hasKids\">Heeft u kinderen die meereizen? *<\/label>\n                <select id=\"hasKids\" name=\"hasKids\" onchange=\"toggleKidInfo()\" required>\n                    <option value=\"nee\">Nee<\/option>\n                    <option value=\"ja\">Ja<\/option>\n                <\/select>\n\n                <div id=\"kidInfoSection\" class=\"hidden\">\n                    <label for=\"numberOfKids\">Aantal kinderen:<\/label>\n                    <input type=\"number\" id=\"numberOfKids\" name=\"numberOfKids\" min=\"0\" max=\"4\" onchange=\"toggleKidDetails()\">\n\n                    <div id=\"kidInfoDetails\" class=\"hidden\">\n                        <label for=\"kidName\">Naam van het kind:<\/label>\n                        <input type=\"text\" id=\"kidName\" name=\"kidName\">\n\n                        <label for=\"kidAge\">Leeftijd van het kind:<\/label>\n                        <input type=\"number\" id=\"kidAge\" name=\"kidAge\" min=\"0\" max=\"18\">\n\n                        <label for=\"kidHeight\">Lengte van het kind (in meters):<\/label>\n                        <input type=\"number\" id=\"kidHeight\" name=\"kidHeight\" step=\"0.01\" min=\"0\" max=\"2\">\n                    <\/div>\n                <\/div>\n\n                <p id=\"errorMessage\" class=\"error-message\">Het totaal aantal passagiers mag niet meer dan 4 zijn (inclusief kinderen).<\/p>\n\n                <label for=\"comment\">Opmerking:<\/label>\n                <textarea id=\"comment\" name=\"comment\"><\/textarea>\n\n                <label><input type=\"checkbox\" id=\"copy\" name=\"copy\"> Stuur mij een kopie van deze aanvraag<\/label>\n\n                <button type=\"submit\">Verstuur aanvraag via WhatsApp<\/button>\n            <\/form>\n        <\/div>\n\n        <div id=\"confirmationMessage\" class=\"confirmation\">\n            Bedankt! Uw aanvraag is verstuurd.\n        <\/div>\n    <\/div>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Taxi Diensten Rotterdam Vraag een rit aan Naam: * E-mail: * Telefoonnummer: * Ophaaladres: * Bestemmings adres: * Tijd: * Datum: * Aantal personen (exclusief kinderen): * Heeft u kinderen die meereizen? * NeeJa Aantal kinderen: Naam van het kind: Leeftijd van het kind: Lengte van het kind (in meters): Het totaal aantal passagiers mag [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-37","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/daacad.nl\/index.php?rest_route=\/wp\/v2\/pages\/37","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/daacad.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/daacad.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/daacad.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/daacad.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=37"}],"version-history":[{"count":73,"href":"https:\/\/daacad.nl\/index.php?rest_route=\/wp\/v2\/pages\/37\/revisions"}],"predecessor-version":[{"id":183,"href":"https:\/\/daacad.nl\/index.php?rest_route=\/wp\/v2\/pages\/37\/revisions\/183"}],"wp:attachment":[{"href":"https:\/\/daacad.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=37"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}