{"id":8570,"date":"2025-07-24T13:00:21","date_gmt":"2025-07-24T07:30:21","guid":{"rendered":"https:\/\/www.med-edu.in\/english\/?page_id=8570"},"modified":"2025-11-27T03:56:30","modified_gmt":"2025-11-26T22:26:30","slug":"feedback-form","status":"publish","type":"page","link":"https:\/\/dmer.maharashtra.gov.in\/english\/feedback-form\/","title":{"rendered":"Feedback Form"},"content":{"rendered":"<div id=\"pl-8570\"  class=\"panel-layout\" ><div id=\"pg-8570-0\"  class=\"panel-grid panel-no-style\" ><div id=\"pgc-8570-0-0\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><div id=\"pgc-8570-0-1\"  class=\"panel-grid-cell panel-grid-cell-mobile-last\" ><div id=\"panel-8570-0-1-0\" class=\"widget_text so-panel widget widget_custom_html panel-first-child panel-last-child\" data-index=\"0\" ><div class=\"textwidget custom-html-widget\"><!-- ==============================\n \u2705 DMER Feedback Form (GIGW & WCAG Compliant)\n============================== -->\n\n<form id=\"dmer-feedback-form\"\n      class=\"dmer-feedback-form\"\n      lang=\"en\"\n      novalidate\n      referrerpolicy=\"strict-origin-when-cross-origin\"\n      aria-labelledby=\"feedback-form-title\"\n      aria-describedby=\"feedback-form-desc required-instruction\">\n\n  <fieldset class=\"dmer-feedback-fieldset\">\n    <legend id=\"feedback-form-title\">Feedback Form<\/legend>\n\n    <!-- Intro Message -->\n    <p id=\"feedback-form-desc\" class=\"dmer-feedback-intro\">\n      <strong>Your feedback is important to us! \ud83d\udd12 <\/strong><br>\n      All your feedback will remain confidential and will only be used to improve quality. Thank you for your cooperation!\n    <\/p>\n    <p id=\"required-instruction\"><span aria-hidden=\"true\">*<\/span><strong> indicates required fields<\/strong><\/p>\n\n    <!-- System Messages -->\n    <div id=\"formErrors\" class=\"dmer-feedback-error-hidden\" role=\"alert\"><\/div>\n    <div id=\"formSuccess\" class=\"dmer-feedback-success-hidden\" role=\"status\"><\/div>\n\n    <!-- Full Name -->\n    <div class=\"dmer-feedback-group\">\n      <label for=\"fullName\">Full Name <span aria-hidden=\"true\">*<\/span><\/label>\n      <input type=\"text\" id=\"fullName\" name=\"fullName\"\n             autocomplete=\"name\"\n             inputmode=\"text\"\n             required aria-required=\"true\"\n             aria-describedby=\"fullNameError\"\n             placeholder=\"Enter your full name\">\n      <div id=\"fullNameError\" class=\"dmer-feedback-error-message\"><\/div>\n    <\/div>\n\n    <!-- Email -->\n    <div class=\"dmer-feedback-group\">\n      <label for=\"email\">Email ID <span aria-hidden=\"true\">*<\/span><\/label>\n      <input type=\"email\" id=\"email\" name=\"email\"\n             autocomplete=\"email\"\n             inputmode=\"email\"\n             required aria-required=\"true\"\n             aria-describedby=\"emailError\"\n             placeholder=\"example@domain.com\">\n      <div id=\"emailError\" class=\"dmer-feedback-error-message\"><\/div>\n    <\/div>\n\n    <!-- Phone -->\n    <div class=\"dmer-feedback-group\">\n      <label for=\"phone\">Phone Number<\/label>\n      <input type=\"tel\" id=\"phone\" name=\"phone\"\n             autocomplete=\"tel\"\n             inputmode=\"tel\"\n             aria-describedby=\"phoneHelp\"\n             placeholder=\"98XXXXXXXX\">\n      <div id=\"phoneHelp\" class=\"dmer-feedback-help\">Optional field<\/div>\n    <\/div>\n\n    <!-- Message -->\n    <div class=\"dmer-feedback-group\">\n      <label for=\"message\">Message (Max 180 characters)<\/label>\n      <textarea id=\"message\" name=\"message\" maxlength=\"180\"\n                aria-describedby=\"charCount messageError\"\n                placeholder=\"Write your feedback here...\"><\/textarea>\n      <div id=\"charCount\" class=\"dmer-feedback-charcount\" aria-live=\"polite\">0 \/ 180<\/div>\n      <div id=\"messageError\" class=\"dmer-feedback-error-message\"><\/div>\n    <\/div>\n\n    <!-- Google reCAPTCHA -->\n    <div class=\"g-recaptcha\"\n         data-sitekey=\"6Le7QAUsAAAAAMjU7VDJ4SmrfhXIHffxvuhIgM-N\"\n         aria-label=\"reCAPTCHA verification\"><\/div>\n\n    <!-- Submit Button -->\n    <div class=\"dmer-feedback-group\">\n      <button type=\"submit\" class=\"dmer-feedback-submit\" aria-label=\"Submit Feedback\">Submit<\/button>\n    <\/div>\n\n    <!-- Disclaimer -->\n    <p class=\"dmer-feedback-disclaimer\">\n      The information provided will only be used for feedback purposes and will not be shared with any third party.\n    <\/p>\n\n    <noscript>\n      <p style=\"color:#b1040e;\">Please enable JavaScript to submit this form.<\/p>\n    <\/noscript>\n\n  <\/fieldset>\n<\/form>\n\n<!-- Google reCAPTCHA Script -->\n<script src=\"https:\/\/www.google.com\/recaptcha\/api.js\" async defer><\/script>\n\n<!-- Polyfill for older browsers (optional) -->\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/whatwg-fetch@3.6.2\/dist\/fetch.umd.min.js\"><\/script>\n\n<!-- ====== JavaScript ====== -->\n<script>\n(function(){\n  const form = document.getElementById('dmer-feedback-form');\n  const fullName = document.getElementById('fullName');\n  const email = document.getElementById('email');\n  const phone = document.getElementById('phone');\n  const message = document.getElementById('message');\n  const charCount = document.getElementById('charCount');\n  const submitBtn = form.querySelector('.dmer-feedback-submit');\n\n  const fullNameError = document.getElementById('fullNameError');\n  const emailError = document.getElementById('emailError');\n  const messageError = document.getElementById('messageError');\n\n  const formErrors = document.getElementById('formErrors');\n  const formSuccess = document.getElementById('formSuccess');\n\n  \/\/ Character counter\n  message.addEventListener('input', () => {\n    charCount.textContent = `${message.value.length} \/ 180`;\n    messageError.textContent = message.value.length <= 180 ? \"\" : \"Message cannot exceed 180 characters.\";\n  });\n\n  \/\/ Validation\n  function validateField(field) {\n    switch(field) {\n      case fullName:\n        fullNameError.textContent = fullName.value.trim() ? \"\" : \"Full name is required.\";\n        break;\n      case email:\n        if(!email.value.trim()) emailError.textContent=\"Email is required.\";\n        else {\n          const emailPattern = \/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$\/;\n          emailError.textContent = emailPattern.test(email.value.trim()) ? \"\" : \"Enter a valid email ID.\";\n        }\n        break;\n      case message:\n        messageError.textContent = message.value.length <= 180 ? \"\" : \"Message cannot exceed 180 characters.\";\n        break;\n    }\n  }\n\n  [fullName, email, message].forEach(f => f.addEventListener('input', () => validateField(f)));\n\n  \/\/ AJAX submit\n  form.addEventListener('submit', function(e){\n    e.preventDefault();\n\n    validateField(fullName);\n    validateField(email);\n    validateField(message);\n\n    if(fullNameError.textContent || emailError.textContent || messageError.textContent){\n      formErrors.style.display=\"block\";\n      formErrors.textContent=\"Please fix all errors and submit again.\";\n      formSuccess.style.display=\"none\";\n      return;\n    }\n\n    \/\/ Validate reCAPTCHA\n    const recaptchaResponse = grecaptcha.getResponse();\n    if(!recaptchaResponse){\n      formErrors.style.display=\"block\";\n      formErrors.textContent=\"Please verify the reCAPTCHA.\";\n      return;\n    }\n\n    submitBtn.disabled = true;\n    submitBtn.textContent = \"Submitting...\";\n\n    const formData = new FormData(form);\n    formData.append('g-recaptcha-response', recaptchaResponse);\n\n    fetch('https:\/\/dmer.maharashtra.gov.in\/wp-content\/themes\/wpex-wptuts\/form\/submit_feedback.php', {\n      method: 'POST',\n      body: formData\n    })\n    .then(res => res.text())\n    .then(data => {\n      formErrors.style.display=\"none\";\n      formSuccess.style.display=\"block\";\n      formSuccess.textContent=\"Your feedback has been successfully submitted. Thank you!\";\n      form.reset();\n      grecaptcha.reset();\n      charCount.textContent = \"0 \/ 180\";\n      submitBtn.disabled = false;\n      submitBtn.textContent = \"Submit\";\n    })\n    .catch(err => {\n      formSuccess.style.display=\"none\";\n      formErrors.style.display=\"block\";\n      formErrors.textContent=\"There was an error sending your message. Please try again later.\";\n      submitBtn.disabled = false;\n      submitBtn.textContent = \"Submit\";\n    });\n  });\n})();\n<\/script>\n\n<!-- ====== CSS ====== -->\n<style>\n.dmer-feedback-form {\n  max-width: 450px;\n  margin: 0 auto;\n  font-family: Arial, sans-serif;\n  padding: 10px;\n}\n\n.dmer-feedback-fieldset {\n  border: none;\n  padding: 0;\n}\n\n.dmer-feedback-group {\n  margin-bottom: 16px;\n}\n\n.dmer-feedback-group label {\n  display: block;\n  font-weight: 600;\n  margin-bottom: 4px;\n}\n\n.dmer-feedback-group input,\n.dmer-feedback-group textarea {\n  width: 100%;\n  box-sizing: border-box;\n  padding: 10px;\n  font-size: 1rem;\n  border: 1px solid #6B6B6B;\n  border-radius: 6px;\n  font-family: inherit;\n}\n\n.dmer-feedback-group textarea {\n  min-height: 80px;\n  resize: vertical;\n}\n\n.dmer-feedback-submit {\n  background-color: #305A91;\n  color: #fff;\n  border: none;\n  cursor: pointer;\n  width: 100%;\n  padding: 12px 0;\n  font-size: 1.05rem;\n  font-weight: 600;\n  border-radius: 6px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1.2;\n  box-sizing: border-box;\n  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);\n  transition: all 0.25s ease;\n  margin-top: 20px;\n}\n\n.dmer-feedback-submit:hover {\n  background-color: #214270;\n  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);\n  transform: translateY(-2px);\n\toutline: 3px solid #ffcc00;\n}\n\n\t\/* Base focus style for keyboard navigation *\/\n.dmer-feedback-submit:focus,\n.dmer-feedback-submit:focus-visible,\n.dmer-feedback-submit:focus-within {\n    outline: 3px solid #ffcc00 !important;        \/* High-contrast focus ring *\/\n    outline-offset: 3px;               \/* Creates space around element *\/\n    border-radius: 4px;                \/* Optional: smooth edges *\/\n}\n\t\n.dmer-feedback-submit:active {\n  transform: translateY(0);\n  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);\n}\n\n.dmer-feedback-error-message {\n  color: #D8000C;\n  font-size: 0.875rem;\n  margin-top: 4px;\n  min-height: 18px;\n}\n\n.dmer-feedback-charcount {\n  font-size: 0.875rem;\n  margin-top: 2px;\n  color: #333;\n}\n\n.dmer-feedback-success-hidden {\n  display: none;\n  background-color: #d4edda;\n  border: 1px solid #28a745;\n  color: #155724;\n  padding: 12px;\n  border-radius: 6px;\n  margin-bottom: 16px;\n  font-weight: 600;\n}\n\n.dmer-feedback-error-hidden {\n  display: none;\n  background-color: #f8d7da;\n  border: 1px solid #d8000C;\n  color: #721c24;\n  padding: 12px;\n  border-radius: 6px;\n  margin-bottom: 16px;\n  font-weight: 600;\n}\n\n.dmer-feedback-disclaimer {\n  font-size: 0.85rem;\n  color: #555;\n  margin-top: 10px;\n  text-align: justify;\n}\n\n.g-recaptcha {\n  display: flex;\n  justify-content: center;\n  margin-top: 10px;\n}\n\n@media screen and (max-width:600px) {\n  .dmer-feedback-form {\n    padding: 8px;\n  }\n}\n\n.dmer-feedback-fieldset legend {\n  text-align: center;\n  font-weight: 700;\n  font-size: 1.3rem;\n  margin-bottom: 20px;\n  color: #214270;\n  display: block;\n  border-bottom: 2px solid #214270;\n  padding-bottom: 6px;\n}\n\n.dmer-feedback-intro {\n  text-align: center;\n  margin-bottom: 15px;\n  color: #214270;\n  font-size: 1rem;\n  line-height: 1.6;\n}\n\n.dmer-feedback-intro strong {\n  font-size: 1.2rem;\n  color: #b1040e;\n}\n\n#required-instruction {\n  margin-top: 10px;\n  font-size: 0.9rem;\n  color: #555;\n  text-align: center;\n}\n<\/style><\/div><\/div><\/div><div id=\"pgc-8570-0-2\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>Feedback Form Your feedback is important to us! \ud83d\udd12 All your feedback will remain confidential and will only be used to improve quality. Thank you for your cooperation! * indicates required fields Full Name * Email ID * Phone Number Optional field Message (Max 180 characters) 0 \/ 180 Submit The information provided will only&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":"","_links_to":"","_links_to_target":""},"class_list":["post-8570","page","type-page","status-publish","hentry","no-featured-image","page-entry","loop-entry boxed clr"],"_links":{"self":[{"href":"https:\/\/dmer.maharashtra.gov.in\/english\/wp-json\/wp\/v2\/pages\/8570","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dmer.maharashtra.gov.in\/english\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dmer.maharashtra.gov.in\/english\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dmer.maharashtra.gov.in\/english\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dmer.maharashtra.gov.in\/english\/wp-json\/wp\/v2\/comments?post=8570"}],"version-history":[{"count":8,"href":"https:\/\/dmer.maharashtra.gov.in\/english\/wp-json\/wp\/v2\/pages\/8570\/revisions"}],"predecessor-version":[{"id":10556,"href":"https:\/\/dmer.maharashtra.gov.in\/english\/wp-json\/wp\/v2\/pages\/8570\/revisions\/10556"}],"wp:attachment":[{"href":"https:\/\/dmer.maharashtra.gov.in\/english\/wp-json\/wp\/v2\/media?parent=8570"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}