Personal blog written from scratch using Node.js, Bootstrap, and MySQL. https://jrtechs.net
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

65 lines
2.5 KiB

  1. <div class='col-md-8'>
  2. <!--Form with header-->
  3. <form action="/contact" method="post">
  4. <div class="card border-primary rounded-0">
  5. <div class="card-header p-0">
  6. <div class="bg-info text-white text-center py-2">
  7. <h3><i class="fa fa-envelope"></i>Contact Me</h3>
  8. <p class="m-0">I would love to hear from you.</p>
  9. </div>
  10. </div>
  11. <div class="card-body p-3">
  12. <!--Body-->
  13. <div class="form-group">
  14. <div class="input-group mb-2">
  15. <div class="input-group-prepend">
  16. <div class="input-group-text"><i class="fa fa-user text-info"></i></div>
  17. </div>
  18. <input type="text" class="form-control" id="name" name="name" placeholder="Name" required>
  19. </div>
  20. </div>
  21. <div class="form-group">
  22. <div class="input-group mb-2">
  23. <div class="input-group-prepend">
  24. <div class="input-group-text"><i class="fa fa-envelope text-info"></i></div>
  25. </div>
  26. <input type="email" class="form-control" id="email" name="email" placeholder="example@gmail.com" required>
  27. </div>
  28. </div>
  29. <div class="form-group">
  30. <div class="input-group mb-2">
  31. <div class="input-group-prepend">
  32. <div class="input-group-text"><i class="fa fa-comment text-info"></i></div>
  33. </div>
  34. <textarea class="form-control" placeholder="Message" required></textarea>
  35. </div>
  36. </div>
  37. <div class="form-group">
  38. <div class="g-recaptcha" data-sitekey="6LceWF8UAAAAAIsd7F6iY_Pywt4fJsJlFNPtEgi9"></div>
  39. </div>
  40. <div class="text-center">
  41. <input type="submit" value="Send" class="btn btn-info btn-block rounded-0 py-2">
  42. </div>
  43. </div>
  44. </div>
  45. </form>
  46. </div>
  47. <script src='https://www.google.com/recaptcha/api.js'></script>
  48. <script>
  49. $("form").submit(function(event) {
  50. var recaptcha = $("#g-recaptcha-response").val();
  51. if (recaptcha === "") {
  52. event.preventDefault();
  53. alert("Please check the recaptcha");
  54. }
  55. });
  56. </script>