From 4168428b9522ebdc965cdea64eb8da713a105f1a Mon Sep 17 00:00:00 2001 From: ya_dim4ik Date: Wed, 13 Apr 2016 10:28:07 +0300 Subject: [PATCH] advertising landing popup form validation --- static/advertising_landing/css/style.css | 28 +++------------ static/advertising_landing/js/script.js | 45 ++++++++++++++---------- 2 files changed, 30 insertions(+), 43 deletions(-) diff --git a/static/advertising_landing/css/style.css b/static/advertising_landing/css/style.css index 26507ec8..fdd7dc2a 100644 --- a/static/advertising_landing/css/style.css +++ b/static/advertising_landing/css/style.css @@ -844,32 +844,12 @@ input, .box { font-family: 'Open Sans', sans-serif; margin-bottom: 14px; } +.popup-form__field.error{ + /* border-color: #f00; */ + box-shadow: 0px 0px 2px 2px #f00; +} .popup-form__btn { margin-top: 15px; width: 350px; } /*end popup*/ - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/static/advertising_landing/js/script.js b/static/advertising_landing/js/script.js index cd692714..7ae25087 100644 --- a/static/advertising_landing/js/script.js +++ b/static/advertising_landing/js/script.js @@ -44,25 +44,32 @@ $(document).ready(function(){ $("form.popup-form").on("submit", function(e){ console.log('11'); e.preventDefault(); - var $this = $(this), - url = $this.attr("action"), - form = $this.serialize(); - $.post( - url, - form, - function(data){ - console.log(data); - if(data.success){ - // show thanks popup - $('.popup__close').click(); - $('.overlay').fadeIn(400, - function () { - $('.popup-thank') - .css('display', 'block') - .animate({opacity: 1}, 200); - }); + var $form = $(this), + url = $form.attr("action"), + data = $form.serialize(), + type = $form.attr('method'); + + $form.find('.error').removeClass('error'); + + $.ajax({ + url: url, + type: type, + data: data, + success: function(data){ + if (data.success) { + $form.parents('.popup').fadeOut(200, function() { + $('.popup-thank') + .css('display', 'block') + .animate({opacity: 1}, 200); + }); } - } - ); + + if (data.errors) { + $.each(data.errors, function(i, val) { + $form.find('input[name="' + i + '"]').addClass('error') + }); + } + } + }); }) });