{"id":27,"date":"2022-06-07T20:58:57","date_gmt":"2022-06-07T20:58:57","guid":{"rendered":"https:\/\/schemavision.com\/?page_id=27"},"modified":"2022-06-10T10:08:49","modified_gmt":"2022-06-10T10:08:49","slug":"questionnaire","status":"publish","type":"page","link":"https:\/\/schemavision.com\/index.php\/questionnaire\/","title":{"rendered":"Questionnaire"},"content":{"rendered":"\n<!DOCTYPE html>\n<html>\n    <head>\n        <style>\n            body {\n                font-family: Arial, sans-serif;\n            }\n            \n            * {\n                box-sizing: border-box;\n            }\n            \n            input[type=text], select, textarea {\n                width: 100%;\n                padding: 12px;\n                border: 1px solid #ccc;\n                border-radius: 4px;\n                resize: vertical;\n            }\n            \n            input[type=email], select, textarea {\n                width: 100%;\n                padding: 12px;\n                border: 1px solid #ccc;\n                border-radius: 4px;\n                resize: vertical;\n            }\n            \n            label {\n                padding: 12px 12px 12px 0;\n                display: inline-block;\n                line-height: 1.5;\n            }\n            \n            hr {\n                width: 50%;\n                text-align: center;\n                border: 1px solid lightgrey;\n            }\n            \n            input[type=submit] {\n                background-color: #04AA6D;\n                color: white;\n                padding: 12px 20px;\n                border: none;\n                border-radius: 4px;\n                cursor: pointer;\n                float: right;\n            }\n            \n            input[type=submit]:hover {\n                background-color: #45a049;\n            }\n            \n            .container {\n                border-radius: 5px;\n                background-color: #f2f2f2;\n                padding: 20px;\n                width: 80%;\n            }\n            \n            .col-25 {\n                float: left;\n                width: 25%;\n                margin-top: 6px;\n            }\n            \n            .col-75 {\n                float: left;\n                width: 75%;\n                margin-top: 6px;\n            }\n            \n            \/* Clear floats after the columns *\/\n            .row:after {\n                content: \"\";\n                display: table;\n                clear: both;\n            }\n            \n            \/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other *\/\n            @media screen and (max-width: 600px) {\n                .col-25, .col-75, input[type=submit] {\n                    width: 100%;\n                    margin-top: 0;\n                }\n            }\n        <\/style>\n        <script>\n            function EmbedImage(input){\n                if (input.files && input.files[0]) {\n                    var reader = new FileReader();\n                    reader.onload = function (e) {\n                        var imageDiv = document.getElementById(\"image-1\");\n                        var newImage = document.createElement(\"img\");\n                        newImage.setAttribute('src', e.target.result);\n                        var oldWidth = newImage.getAttribute('width');\n                        var olHeight = newImage.getAttribute('height');\n                        newImage.setAttribute('width', 200);\n                        newImage.setAttribute('height', 200 * (olHeight \/ oldWidth));\n                        \/\/imageDiv.appendChild(newImage);\n                        input.parentNode.appendChild(newImage);\n                    \/\/$('#blah')\n                    \/\/    .attr('src', e.target.result)\n                    \/\/    .width(150)\n                    \/\/    .height(200);\n                    }\n                    reader.readAsDataURL(input.files[0]);\n                }\n                \/\/var image = document.getElementById(\"switchboard\");\n                \/\/document.getElementById(\"image-1\").\n            }\n            \n            function AlertTest(){\n                alert(\"test\");\n            }\n            \n            function SendResults(){\n                var firstName = document.getElementById(\"e1\").value;\n                var lastName = document.getElementById(\"e2\").value;\n                var address = document.getElementById(\"e3\").value;\n                var emailAddress = document.getElementById(\"e4\").value;\n                var phoneNumber = document.getElementById(\"e5\").value;\n                \n                var q1 = document.querySelector('input[name=\"q1\"]:checked').value;\n                var q2 = document.querySelector('input[name=\"q2\"]:checked').value;\n                var q3 = document.querySelector('input[name=\"q3\"]:checked').value;\n                var q4 = document.querySelector('input[name=\"q4\"]:checked').value;\n                var q5 = document.querySelector('input[name=\"q5\"]:checked').value;\n                var q6 = document.querySelector('input[name=\"q6\"]:checked').value;\n                var q7 = document.querySelector('input[name=\"q7\"]:checked').value;\n                \n                \/\/if (document.getElementById(\"q1a1\").checked)\n                \/\/{\n                \/\/    q1 = document.getElementById(\"q1a1\").value;\n                \/\/}\n                \/\/else if (document.getElementById(\"q1a2\").checked)\n                \/\/{\n                \/\/    q1 = document.getElementById(\"q1a2\").value;\n                \/\/}\n                \/\/else if (document.getElementById(\"q1a3\").checked)\n                \/\/{\n                \/\/    q1 = document.getElementById(\"q1a3\").value;\n                \/\/}\n                \/\/else if (document.getElementById(\"q1a4\").checked)\n                \/\/{\n                \/\/    q1 = document.getElementById(\"q1a4\").value;\n                \/\/}\n                \/\/else if (document.getElementById(\"q1a5\").checked)\n                \/\/{\n                \/\/    q1 = document.getElementById(\"q1a5\").value;\n                \/\/}\n                \n                alert(firstName + lastName + address + emailAddress + phoneNumber + q1);\n            }\n            \n            emailTest(){\n                const xmlhttp = new XMLHttpRequest();\n                \/\/xmlhttp.onload = function() {\n                \/\/   document.getElementById(\"txtHint\").innerHTML = this.responseText;\n                \/\/}\n                var e1 = document.getElementById(\"e1\").value;\n                xmlhttp.open(\"GET\", \"questionnaire.php?firstName=\" + e1);\n                xmlhttp.send();\n            }\n        <\/script>\n    <\/head>\n    <body>\n        <div class=\"container\" \"col-75\">\n            <form name=\"qForm\" enctype=\"multipart\/form-data\">\n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"e1\">First Name<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"text\" id=\"e1\" name=\"e1\">\n                    <\/div>\n                <\/div>\n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label  for=\"e2\">Last Name<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"text\" id=\"e2\" name=\"e2\">\n                    <\/div>\n                <\/div>\n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"e3\">Address<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"text\"id=\"e3\" name=\"e3\">\n                    <\/div>\n                <\/div>\n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"e4\">Email Address<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"email\" id=\"e4\" name=\"e4\">\n                    <\/div>\n                <\/div>\n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"e5\">Phone Number<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"text\"id=\"e5\" name=\"e5\">\n                    <\/div>\n                <\/div>\n                <br><hr>\n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"q1\">What kind of hot water system do you currently have?<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"radio\" id=\"q1a1\" name=\"q1\" value=\"Electric Standalone Tank\">\n                        <label for=\"q1a1\">Electric Standalone Tank<\/label><br>\n                        <input type=\"radio\" id=\"q1a2\" name=\"q1\" value=\"Solar Hot Water System Gas\">\n                        <label for=\"q1a2\">Solar Hot Water System Gas<\/label><br>\n                        <input type=\"radio\" id=\"q1a3\" name=\"q1\" value=\"Solar Hot Water System Electric\">\n                        <label for=\"q1a3\">Solar Hot Water System Electric<\/label><br>\n                        <input type=\"radio\" id=\"q1a4\" name=\"q1\" value=\"Gas Instantaneous System\">\n                        <label for=\"q1a4\">Gas Instantaneous System<\/label><br>\n                        <input type=\"radio\" id=\"q1a5\" name=\"q1\" value=\"Gas Storage System\">\n                        <label for=\"q1a5\">Gas Storage System<\/label><br>\n                    <\/div>\n                <\/div>\n                <br><hr>\n                \n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"q2\">Where is your tank located?<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"radio\" id=\"q2a1\" name=\"q2\" value=\"Ground\">\n                        <label for=\"q1a1\">Ground<\/label><br>\n                        <input type=\"radio\" id=\"q2a2\" name=\"q2\" value=\"Roof\">\n                        <label for=\"q1a2\">Roof<\/label><br>\n                        <input type=\"radio\" id=\"q2a3\" name=\"q2\" value=\"Under house\">\n                        <label for=\"q1a2\">Under house<\/label><br>\n                    <\/div>\n                <\/div>\n                <br><hr>\n                \n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"q3\">What size is your home?<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"radio\" id=\"q3a1\" name=\"q3\" value=\"Single Story\">\n                        <label for=\"q3a1\">Single Story<\/label><br>\n                        <input type=\"radio\" id=\"q3a2\" name=\"q3\" value=\"Double Story\">\n                        <label for=\"q3a2\">Double Story<\/label><br>\n                    <\/div>\n                <\/div>\n                <br><hr>\n                \n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"q4\">Type of roof?<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"radio\" id=\"q4a1\" name=\"q4\" value=\"Tile Roof\">\n                        <label for=\"q4a1\">Tile Roof<\/label><br>\n                        <input type=\"radio\" id=\"q4a2\" name=\"q4\" value=\"Metal Roof\">\n                        <label for=\"q4a2\">Metal Roof<\/label><br>\n                    <\/div>\n                <\/div>\n                <br><hr>\n                \n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"q5\">Access under house<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"radio\" id=\"q5a1\" name=\"q5\" value=\"Yes\">\n                        <label for=\"q5a1\">Yes<\/label>\n                        <input type=\"radio\" id=\"q5a2\" name=\"q5\" value=\"No\">\n                        <label for=\"q5a2\">No<\/label>\n                    <\/div>\n                <\/div>\n                <br><hr>\n                \n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"q6\">If solar hot water panels are on the roof would you like them removed?<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"radio\" id=\"q6a1\" name=\"q6\" value=\"Yes\">\n                        <label for=\"q6a1\">Yes<\/label>\n                        <input type=\"radio\" id=\"q6a2\" name=\"q6\" value=\"No\">\n                        <label for=\"q6a2\">No<\/label>\n                        <input type=\"radio\" id=\"q6a3\" name=\"q6\" value=\"N\/A\">\n                        <label for=\"q6a3\">N\/A<\/label>\n                    <\/div>\n                <\/div>\n                <br><hr>\n                \n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"q7\">Access on site. We need to wheel the new unit in on a trolley, the width required is 700mm<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <input type=\"radio\" id=\"q7a1\" name=\"q7\" value=\"Yes\">\n                        <label for=\"q7a1\">Yes<\/label>\n                        \n                        <input type=\"radio\" id=\"q7a2\" name=\"q7\" value=\"No\">\n                        <label for=\"q7a2\">No<\/label>\n                    <\/div>\n                <\/div>\n                <br><hr>\n                \n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <label for=\"image\">Photos required<\/label>\n                    <\/div>\n                    <div class=\"col-75\">\n                        <div>\n                            <input type=\"file\" id=\"switchboard\" name=\"image\" accept=\"image\/*\" onchange=\"EmbedImage(this);\">\n                            <label for=\"switchboard\">Switchboard<\/label>\n                        <\/div>\n                        <div>\n                            <input type=\"file\" id=\"existing-unit\" name=\"image\" accept=\"image\/*\" onchange=\"EmbedImage(this);\">\n                            <label for=\"existing-unit\">Existing unit<\/label>\n                        <\/div>\n                        \n                    <\/div>\n                <\/div>\n                <div class=\"row\">\n                    <div class=\"col-25\">\n                        <input type=\"submit\" onclick=\"emailTest()\"\/>\n                    <\/div>\n                <\/div>\n            <\/form>\n        <\/div>\n    <\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>First Name Last Name Address Email Address Phone Number What kind of hot water system do you currently have? Electric Standalone Tank Solar Hot Water &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},"_links":{"self":[{"href":"https:\/\/schemavision.com\/index.php\/wp-json\/wp\/v2\/pages\/27"}],"collection":[{"href":"https:\/\/schemavision.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/schemavision.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/schemavision.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/schemavision.com\/index.php\/wp-json\/wp\/v2\/comments?post=27"}],"version-history":[{"count":11,"href":"https:\/\/schemavision.com\/index.php\/wp-json\/wp\/v2\/pages\/27\/revisions"}],"predecessor-version":[{"id":40,"href":"https:\/\/schemavision.com\/index.php\/wp-json\/wp\/v2\/pages\/27\/revisions\/40"}],"wp:attachment":[{"href":"https:\/\/schemavision.com\/index.php\/wp-json\/wp\/v2\/media?parent=27"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}