diff --git a/resources/assets/js/contact.js b/resources/assets/js/contact.js index a6160b6..8e1452d 100644 --- a/resources/assets/js/contact.js +++ b/resources/assets/js/contact.js @@ -2,21 +2,26 @@ function contactFormInit() { const $form = $("#contact-form"), $input = $form.find(":input"), - $notify = $("#notification"); + $name = $form.find("[name='name']"), + $email = $form.find("[name='email']"), + $message = $form.find("[name='message']"), + $token = $form.find("[name='_token']"), + $submit = $form.find("[name='submit']"), + $notify = $form.find(".notification"); let contact = {}, submitting = false; const getContactData = function() { contact = { - name: $("#name").val(), - email: $("#email").val(), - message: $("#message").val(), - _token: $("#token").val() + name: $name.val(), + email: $email.val(), + message: $message.val(), + _token: $token.val() }; }; - $("#submit").on("click", function(e) { + $submit.on("click", function(e) { const $submit = $(this); e.preventDefault(); @@ -30,7 +35,7 @@ function contactFormInit() { url: "/api/contact-submit", data: contact }).always(function(response) { - let responseJSON, errors, prop; + let errors; $form.find(".error").removeClass("error"); $notify.removeClass("visible"); @@ -40,13 +45,12 @@ function contactFormInit() { $submit.addClass("disabled"); $notify.text("Thanks for your message!").addClass("success").addClass("visible"); } else { - responseJSON = response.responseJSON; errors = 0; // add the error class to fields that haven't been filled out - for (prop in responseJSON) { - if (responseJSON.hasOwnProperty(prop)) { - $("#" + prop).addClass("error"); + for (let errorName in response.responseJSON.errors) { + if ($form.find(`[name='${errorName}']`).length) { + $form.find(`[name='${errorName}']`).addClass("error"); errors++; } } diff --git a/resources/assets/sass/pages/_contact.scss b/resources/assets/sass/pages/_contact.scss index a0f65c6..d2f97b3 100644 --- a/resources/assets/sass/pages/_contact.scss +++ b/resources/assets/sass/pages/_contact.scss @@ -21,7 +21,7 @@ height: 150px; } - #submit { + .submit { background-color: lighten($c-base, 5%); color: $c-text-light; font-weight: bold; @@ -31,7 +31,7 @@ &.disabled { background-color: $c-base; } } - #notification { + .notification { margin: 0px auto 15px auto; padding: 5px 10px; background-color: lighten($c-error, 15%); diff --git a/resources/views/website/contact.blade.php b/resources/views/website/contact.blade.php index 27594cd..4178537 100644 --- a/resources/views/website/contact.blade.php +++ b/resources/views/website/contact.blade.php @@ -12,14 +12,14 @@
- - - - - + + + + +
-
Error: There were problems with the 0 fields highlighted above
+
Error: There were problems with the 0 fields highlighted above