diff --git a/themes/blueprint/css/styles.css b/themes/blueprint/css/styles.css index 5658b75eca93a65f59e4dd2daac273bcfaadbca9..ba3ce44919fbbe73526f5b01399f887b86d615d4 100644 --- a/themes/blueprint/css/styles.css +++ b/themes/blueprint/css/styles.css @@ -2051,6 +2051,10 @@ p.feedbackHeader { line-height: 2.5; } +#contact_form .invalid { + background-color: white; +} + /* changes the text on the feedback home page */ .feedbackPageLabel { color: black; diff --git a/themes/blueprint/js/feedback.js b/themes/blueprint/js/feedback.js index 8b8100418fa2d0afcf709f061ba4b2c431fad943..0bdef3d2fcb5ca221b9efb481e6f23d7f225a199 100644 --- a/themes/blueprint/js/feedback.js +++ b/themes/blueprint/js/feedback.js @@ -1,7 +1,7 @@ -/*global alert, path, tabImage*/ +/*global alert, tabImage*/ // This overrides settings in jquery.tabSlideOut.v2.0.js -$(function(){ +$(document).ready(function(){ $('.slide-out-div').tabSlideOut({ pathToTabImage: tabImage, imageHeight: '86px', @@ -13,7 +13,7 @@ $(function(){ }); // This is the ajax for the feedback -$(function() { +$(document).ready(function(){ $('.error').hide(); $("div#slideOut").removeClass('slideOutForm'); $('input.text-input').addClass('feedbackDeselect'); @@ -24,42 +24,17 @@ $(function() { $(this).removeClass('feedbackSelect').addClass('feedbackDeselect'); }); - $(".button").click(function() { + $('#contact_form form').validate(); + $('#contact_form form').unbind('submit').submit(function() { // validate and process form here - // first hide error messages - $('.submit_button').hide(); - $('.error').hide(); + var name = $("input#name"); + var email = $("input#email"); + var comments = $("textarea#comments"); + if (!$(this).valid() || !name.valid() || !email.valid() || !comments.valid()) { return false; } - var name = $("input#name").val(); - if (name == "") { - $("label#name_error").show(); - $("input#name").focus(); - return false; - } - var email = $("input#email").val(); - if (email == "") { - $("label#email_error").show(); - $("input#email").focus(); - return false; - } - function validateEmail(email) { - var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; - return re.test(email); - } - if(!validateEmail(email)) { - $("label#invalid_email_error").show(); - $("input#email").focus(); - return false; - } - var comments = $("textarea#comments").val(); - if (comments == "") { - $("label#comments_error").show(); - return false; - } - $('input#submit_btn').hide(); + var dataString = 'name='+ encodeURIComponent(name.val()) + '&email=' + + encodeURIComponent(email.val()) + '&comments=' + encodeURIComponent(comments.val()); - var dataString = 'name='+ encodeURIComponent(name) + '&email=' - + encodeURIComponent(email) + '&comments=' + encodeURIComponent(comments); // Grabs hidden inputs var formSuccess = $("input#formSuccess").val(); var feedbackSuccess = $("input#feedbackSuccess").val(); @@ -67,7 +42,7 @@ $(function() { $.ajax({ type: "POST", - url: path + '/Feedback/Email', + url: $(this).attr('action'), data: dataString, success: function() { $('#contact_form').html("<div id='message'></div>"); @@ -82,6 +57,6 @@ $(function() { alert(feedbackFailure); } }); - return false; + return false; }); }); diff --git a/themes/blueprint/templates/feedback/form.phtml b/themes/blueprint/templates/feedback/form.phtml index d1d0f0070717c9902b34637b85e1a6d71f24c51e..9a1520e0a6ecbb0ca7526f73eedf2a58ae5b263f 100644 --- a/themes/blueprint/templates/feedback/form.phtml +++ b/themes/blueprint/templates/feedback/form.phtml @@ -1,25 +1,17 @@ <div id="contact_form"> - <form method="post"> + <form method="post" action="<?=$this->url('feedback-email')?>"> <p class="feedbackHeader"><b><?=$this->transEsc("Send us your feedback!")?></b></p> <label for="name" style="line-height: 2.5;"> <?=$this->transEsc("feedback_name")?></label> <label class="error" for="name"> - <?=$this->transEsc("Please enable JavaScript.")?></label> - <label class="error" for="name" id="name_error"> - <?=$this->transEsc("This field is required")?>.</label><br /> - <input type="text" id="name" size="30" class="text-input" /><br /> + <?=$this->transEsc("Please enable JavaScript.")?></label><br /> + <input type="text" id="name" size="30" class="text-input <?=$this->jqueryValidation(array('required'=>'This field is required'))?>" /><br /> <label for="email" style="line-height: 2.5;"> - <?=$this->transEsc("Email")?></label> - <label class="error" for="email" id="email_error"> - <?=$this->transEsc("This field is required")?>.</label> - <label class="error" for="email" id="invalid_email_error"> - <?=$this->transEsc("Email address is invalid")?>.</label><br /> - <input type="text" id="email" size="30" class="text-input" /><br /> + <?=$this->transEsc("Email")?></label><br /> + <input type="text" id="email" size="30" class="text-input <?=$this->jqueryValidation(array('required'=>'This field is required', 'email'=>'Email address is invalid'))?>" /><br /> <label for="comments" style="line-height: 2.5;"> - <?=$this->transEsc("Comments")?></label> - <label class="error" for="comments" id="comments_error"> - <?=$this->transEsc("This field is required")?>.</label><br /> - <textarea id="comments" style="width:250px;height:130px"></textarea><br /> + <?=$this->transEsc("Comments")?></label><br /> + <textarea id="comments" style="width:250px;height:130px" class="<?=$this->jqueryValidation(array('required'=>'This field is required'))?>"></textarea><br /> <input type="submit" class="button" value="<?=$this->transEsc("Send")?>" /> <input type="hidden" id="formSuccess" value="<?=$this->transEsc("Form Submitted!")?>"/> <input type="hidden" id="feedbackSuccess" value="<?=$this->transEsc("Thank you for your feedback.")?>"/>