{"id":2509,"date":"2022-10-02T21:17:05","date_gmt":"2022-10-02T21:17:05","guid":{"rendered":"https:\/\/locksmiths.ae\/brasa\/?page_id=2509"},"modified":"2022-10-02T21:20:12","modified_gmt":"2022-10-02T21:20:12","slug":"feedback2","status":"publish","type":"page","link":"https:\/\/brasadebrazil.com\/new\/feedback2\/","title":{"rendered":"Feedback2"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2509\" class=\"elementor elementor-2509\">\n\t\t\t\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-45ff61c elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"45ff61c\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-4f82c71\" data-id=\"4f82c71\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-db3ee8a elementor-widget elementor-widget-html\" data-id=\"db3ee8a\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css?family=Raleway\" rel=\"stylesheet\">\r\n<form id=\"regForm\" action=\"\/action_page.php\">\r\n  <h1>Register:<\/h1>\r\n  <!-- One \"tab\" for each step in the form: -->\r\n  <div class=\"tab\">Name:\r\n    <p><input placeholder=\"First name...\" oninput=\"this.className = ''\" name=\"fname\"><\/p>\r\n    <p><input placeholder=\"Last name...\" oninput=\"this.className = ''\" name=\"lname\"><\/p>\r\n  <\/div>\r\n  <div class=\"tab\">Contact Info:\r\n    <p><input placeholder=\"E-mail...\" oninput=\"this.className = ''\" name=\"email\"><\/p>\r\n    <p><input placeholder=\"Phone...\" oninput=\"this.className = ''\" name=\"phone\"><\/p>\r\n  <\/div>\r\n  <div class=\"tab\">Birthday:\r\n    <p><input placeholder=\"dd\" oninput=\"this.className = ''\" name=\"dd\"><\/p>\r\n    <p><input placeholder=\"mm\" oninput=\"this.className = ''\" name=\"nn\"><\/p>\r\n    <p><input placeholder=\"yyyy\" oninput=\"this.className = ''\" name=\"yyyy\"><\/p>\r\n  <\/div>\r\n  <div class=\"tab\">Login Info:\r\n    <p><input placeholder=\"Username...\" oninput=\"this.className = ''\" name=\"uname\"><\/p>\r\n    <p><input placeholder=\"Password...\" oninput=\"this.className = ''\" name=\"pword\" type=\"password\"><\/p>\r\n  <\/div>\r\n  <div style=\"overflow:auto;\">\r\n    <div style=\"float:right;\">\r\n      <button type=\"button\" id=\"prevBtn\" onclick=\"nextPrev(-1)\">Previous<\/button>\r\n      <button type=\"button\" id=\"nextBtn\" onclick=\"nextPrev(1)\">Next<\/button>\r\n    <\/div>\r\n  <\/div>\r\n  <!-- Circles which indicates the steps of the form: -->\r\n  <div style=\"text-align:center;margin-top:40px;\">\r\n    <span class=\"step\"><\/span>\r\n    <span class=\"step\"><\/span>\r\n    <span class=\"step\"><\/span>\r\n    <span class=\"step\"><\/span>\r\n  <\/div>\r\n<\/form>\r\n\r\n\r\n\r\n<script>\r\nvar currentTab = 0; \/\/ Current tab is set to be the first tab (0)\r\nshowTab(currentTab); \/\/ Display the current tab\r\n\r\nfunction showTab(n) {\r\n  \/\/ This function will display the specified tab of the form...\r\n  var x = document.getElementsByClassName(\"tab\");\r\n  x[n].style.display = \"block\";\r\n  \/\/... and fix the Previous\/Next buttons:\r\n  if (n == 0) {\r\n    document.getElementById(\"prevBtn\").style.display = \"none\";\r\n  } else {\r\n    document.getElementById(\"prevBtn\").style.display = \"inline\";\r\n  }\r\n  if (n == (x.length - 1)) {\r\n    document.getElementById(\"nextBtn\").innerHTML = \"Submit\";\r\n  } else {\r\n    document.getElementById(\"nextBtn\").innerHTML = \"Next\";\r\n  }\r\n  \/\/... and run a function that will display the correct step indicator:\r\n  fixStepIndicator(n)\r\n}\r\n\r\nfunction nextPrev(n) {\r\n  \/\/ This function will figure out which tab to display\r\n  var x = document.getElementsByClassName(\"tab\");\r\n  \/\/ Exit the function if any field in the current tab is invalid:\r\n  if (n == 1 && !validateForm()) return false;\r\n  \/\/ Hide the current tab:\r\n  x[currentTab].style.display = \"none\";\r\n  \/\/ Increase or decrease the current tab by 1:\r\n  currentTab = currentTab + n;\r\n  \/\/ if you have reached the end of the form...\r\n  if (currentTab >= x.length) {\r\n    \/\/ ... the form gets submitted:\r\n    document.getElementById(\"regForm\").submit();\r\n    return false;\r\n  }\r\n  \/\/ Otherwise, display the correct tab:\r\n  showTab(currentTab);\r\n}\r\n\r\nfunction validateForm() {\r\n  \/\/ This function deals with validation of the form fields\r\n  var x, y, i, valid = true;\r\n  x = document.getElementsByClassName(\"tab\");\r\n  y = x[currentTab].getElementsByTagName(\"input\");\r\n  \/\/ A loop that checks every input field in the current tab:\r\n  for (i = 0; i < y.length; i++) {\r\n    \/\/ If a field is empty...\r\n    if (y[i].value == \"\") {\r\n      \/\/ add an \"invalid\" class to the field:\r\n      y[i].className += \" invalid\";\r\n      \/\/ and set the current valid status to false\r\n      valid = false;\r\n    }\r\n  }\r\n  \/\/ If the valid status is true, mark the step as finished and valid:\r\n  if (valid) {\r\n    document.getElementsByClassName(\"step\")[currentTab].className += \" finish\";\r\n  }\r\n  return valid; \/\/ return the valid status\r\n}\r\n\r\nfunction fixStepIndicator(n) {\r\n  \/\/ This function removes the \"active\" class of all steps...\r\n  var i, x = document.getElementsByClassName(\"step\");\r\n  for (i = 0; i < x.length; i++) {\r\n    x[i].className = x[i].className.replace(\" active\", \"\");\r\n  }\r\n  \/\/... and adds the \"active\" class on the current step:\r\n  x[n].className += \" active\";\r\n}\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ff2b455 elementor-widget elementor-widget-shortcode\" data-id=\"ff2b455\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-shortcode\"><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Register: Name: Contact Info: Birthday: Login Info: Previous Next<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2509","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/brasadebrazil.com\/new\/wp-json\/wp\/v2\/pages\/2509","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/brasadebrazil.com\/new\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/brasadebrazil.com\/new\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/brasadebrazil.com\/new\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/brasadebrazil.com\/new\/wp-json\/wp\/v2\/comments?post=2509"}],"version-history":[{"count":7,"href":"https:\/\/brasadebrazil.com\/new\/wp-json\/wp\/v2\/pages\/2509\/revisions"}],"predecessor-version":[{"id":2517,"href":"https:\/\/brasadebrazil.com\/new\/wp-json\/wp\/v2\/pages\/2509\/revisions\/2517"}],"wp:attachment":[{"href":"https:\/\/brasadebrazil.com\/new\/wp-json\/wp\/v2\/media?parent=2509"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}