https:\/\/freelifemakers.org\/lec\/form4-1.php<\/a><\/p>\n\n\n\n<?php\n\n$fileName = \".\/form_action4.php\";\nif(!is_file($fileName)){\n $form_action_name = basename($_SERVER['PHP_SELF']);\n}else{\n $form_action_name = \".\/form_action4.php\";\n}\n?>\n\n<!DOCTYPE html>\n<html>\n <head>\n \u200b <title>Bootstrap 5 webform<\/title>\n <!--\uc774 \ubd80\ubd84\uc740 html\ucf54\uba58\ud2b8 \uc601\uc5ed This part is the html comment area,\ub9c8\uc784\ud0c0\uc785\uc124\uc815 Mime type settings\/\/-->\n <meta charset=\"utf-8\">\n <!-- \ubaa8\ubc14\uc77c\ud3f0 \uc2a4\ud06c\ub9b0 \uc635\uc158 Mobile phone screen options\/\/-->\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <!--\ubd80\ud2b8\uc2a4\ud2b8\ub7a95 CDN\ubc29\uc2dd \ub9c1\ud06c Bootstrap 5 CDN method link\/\/-->\n <link href=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.2.3\/dist\/css\/bootstrap.min.css\" rel=\"stylesheet\">\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.2.3\/dist\/js\/bootstrap.bundle.min.js\"><\/script>\n\n <!-- \ud3fc\uccb4\ud06c innerHTML\uacbd\uace0 \uba54\uc2dc\uc9c0 \ucd9c\ub825 -->\n <!-- Form check innerHTML warning message output \/\/-->\n <script>\n function frmSubmit(){\n \n \/\/name input box\uc5d0\uc11c \uac12\uc744 \uac00\uc838\uc624\uae30\n \/\/Get value from name input box\n const frmName = document.getElementById(\"name\").value;\n const frmEmail = document.getElementById(\"email\").value; \n const frmPwd = document.getElementById(\"pwd\").value;\n\n \/\/\uc774\uba54\uc77c \ubc0f \uc6f9\uc0ac\uc774\ud2b8 \uc720\ud6a8\uc131\uac80\uc0ac\n \/\/Regular expression for email validation\n const regex = \/^[\\w-]+(\\.[\\w-]+)*@([\\w-]+\\.)+[a-zA-Z]{2,3}$\/;\n\n \/\/\uc815\uaddc\ud45c\ud604\uc2dd\uacfc \ube44\uad50\ud558\uc5ec \uc774\uba54\uc77c\ud14c\uc2a4\ud2b8\n \/\/Test the email against the regular expression\n const emailCheck = regex.test(frmEmail); \n\n \/\/\uc5d0\ub7ec\uba54\uc138\uc9c0 \ucd08\uae30\ud654\n \/\/Reset error message\n errorName.innerHTML = \"\";\n errorEmail.innerHTML = \"\"; \n errorPwd.innerHTML = \"\";<\/mark>\n \n \/\/\uac12\uc758 \uc874\uc7ac \uc5ec\ubd80\uccb4\ud06c ,\uacf5\ubc31\uc774\uba74 \uacbd\uace0\ucc3d \ub744\uc6b0\uae30\n \/\/Check whether value exists, if blank, display warning window\n if(frmName == \"\"){\n \/\/errorName.innerHTML =\"<p>\uc774\ub984\uc744 \uc785\ub825\ud558\uc138\uc694(Please Enter Your Name)<\/p>\";\n alert(\"\uc774\ub984\uc744 \uc785\ub825\ud558\uc138\uc694(Please Enter Your Name)\");\n document.getElementById(\"name\").focus();<\/mark>\n return;\n }else if(frmEmail == \"\"){\n \/\/errorEmail.innerHTML =\"<p>Email\uc744 \uc785\ub825\ud558\uc138\uc694(Please Enter Your Email)<\/p>\";\n alert(\"Email\uc744 \uc785\ub825\ud558\uc138\uc694(Please Enter Your Email)\");\n document.getElementById(\"email\").focus();<\/mark>\n return;\n }else if(emailCheck == false){ \n \/\/errorEmail.innerHTML =\"<p>\uc815\ud655\ud55c Email\uc744 \uc785\ub825\ud558\uc138\uc694(Please enter the correct Email)<\/p>\"; \n alert(\"\uc815\ud655\ud55c Email\uc744 \uc785\ub825\ud558\uc138\uc694(Please enter the correct Email)\");\n document.getElementById(\"email\").focus();<\/mark>\n return; \n }else if(frmPwd == \"\"){\n \/\/errorPwd.innerHTML =\"<p>\ud328\uc2a4\uc6cc\ub4dc\ub97c \uc785\ub825\ud558\uc138\uc694(Please Enter Your Password)<\/p>\";\n alert(\"\ud328\uc2a4\uc6cc\ub4dc\ub97c \uc785\ub825\ud558\uc138\uc694(Please Enter Your Password)\");\n document.getElementById(\"pwd\").focus();<\/mark>\n return; \n }else{\n frm.submit();\n }\n }\n <\/script>\n\n <\/head>\n <body>\n <div class=\"container-sm\"> \n <!--HTML\ud3fc\uc2dc\uc791 Start HTML form \/\/-->\n <!--\ud3fc\uc774\ub984 \ucd9c\ub825 Print form name \/\/-->\n <form id=\"frm\" action=\"<?php echo $form_action_name; ?>\" method=\"post\">\n <div class=\"mb-3\">\n <label for=\"name\" class=\"form-label\">\uc774\ub984(Name):<\/label>\n <input type=\"text\" class=\"form-control\" id=\"name\" placeholder=\"Enter Your Name\" name=\"name\" required>\n <div id=\"errorName\"><\/div><\/mark>\n <\/div>\n\n <div class=\"mb-3\">\n <label for=\"email\" class=\"form-label\">Email:<\/label>\n <input type=\"text\" class=\"form-control\" id=\"email\" placeholder=\"ID@exmale.com\" name=\"email\" required>\n <div id=\"errorEmail\"><\/div><\/mark>\n <\/div>\n\n <div class=\"mb-3\">\n <label for=\"pwd\" class=\"form-label\">Password:<\/label>\n <input type=\"password\" class=\"form-control\" id=\"pwd\" placeholder=\"Enter your password\" name=\"pswd\" required>\n <div id=\"errorPwd\"><\/div><\/mark>\n <\/div> \n\n <div class=\"mb-3\">\n <div class=\"form-check mb-3\">\n <label class=\"form-check-label\">Remember me<\/label>\n <input class=\"form-check-input\" type=\"checkbox\" name=\"remember\">\n <\/div>\n <\/div>\n\n <button type=\"button\" class=\"btn btn-primary\" onClick=\"frmSubmit();\">Submit<\/button>\n <\/form>\n <!--HTML\ud3fc \ub05d End of HTML form\/\/-->\n <\/div> \n <\/body>\n<\/html> \n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"\ud3fc \uc720\ud6a8\uc131 \ud655\uc778\uc744 \uc704\ud574 innerHTML\ub300\uc2e0\uc5d0 alert()\uc744 \uc0ac\uc6a9\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\uc544\ub798\uc758 \ucf54\ub4dc\uc5d0\uc11c innerHTM \uc2e4\ud589\ubd80\ubd84\uc740 \ucf54\uba58\ud2b8 \ucc98\ub9ac\ud588\uc2b5\ub2c8\ub2e4.\ub178\ub780\uc0c9\uc740 innerHTML\uc744 \uc704\ud55c \ubd80\ubd84\uc774\uace0 \ub179\uc0c9\uc740 alert()\uc744 \uc704\ud55c \ubd80\ubd84\uc785\ub2c8\ub2e4.document.getElementById(“[ID]”).focus();\ub294 autofocus\ub97c \uc704\ud55c \ubd80\ubd84\uc785\ub2c8\ub2e4. You can use alert() instead of innerHTML for form validation.In the code below, the innerHTM execution part has been commented out.The yellow part is for innerHTML and the green part is […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[],"class_list":["post-457","post","type-post","status-publish","format-standard","hentry","category-php","missing-thumbnail"],"_links":{"self":[{"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/posts\/457","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/comments?post=457"}],"version-history":[{"count":4,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/posts\/457\/revisions"}],"predecessor-version":[{"id":461,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/posts\/457\/revisions\/461"}],"wp:attachment":[{"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/media?parent=457"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/categories?post=457"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/tags?post=457"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}