Advertisement
Guest User

Hardened JS for newsletter subscribtion

a guest
Oct 14th, 2014
16
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. $(document).ready(function() {
  2.  
  3.     // $(document).acknowledgeinput({
  4.     //  default_state: 'hidden'
  5.     //});
  6.  
  7.     var formEl = '#__FORMNAME__';
  8.     var submitEl = formEl + ' .btn-submit';
  9.     var spinnerEl = '<span class="spinner fa fa-circle-o-notch fa-spin"><!-- --></span>';
  10.     var spinnerSelector = formEl + ' .spinner';
  11.  
  12.     $(submitEl).click(function(e) {
  13.         e.preventDefault();
  14.  
  15.         // get form data and also include the input that was pressed
  16.         var formData = $(this).closest('form').serializeArray();
  17.         formData.push({ name: this.name, value: this.value });
  18.  
  19.         // create a uniqe tag id for temporary message
  20.         var ts = Math.round(+new Date());
  21.         var messageTagId = 'contact-form-message' + ts;
  22.  
  23.         // Disable button, and fade in spinner
  24.         $(submitEl).append(spinnerEl).fadeIn(50);
  25.         $(submitEl).attr('disabled', 'disabled');
  26.  
  27.         $.ajax({
  28.             //type of receiving data
  29.             type: 'POST',
  30.  
  31.             //page where ajax is running
  32.             url: $(formEl).attr('action') + '?type=6171240&tx_pxanewslettersubscription_subscription%5Baction%5D=ajax',
  33.  
  34.             //send_data, data which will be send to php
  35.             data: formData,
  36.             dataType: "JSON",
  37.             // if call is ok
  38.             success: function(response) {
  39.                 //ajax sends msg from php, which informs user, what has happens
  40.                 $(formEl).after('<div id="' + messageTagId + '" class="alert">' + response.message + '<div>');
  41.                 if (response.success) {
  42.                     // display message
  43.                     $('#' + messageTagId).addClass('alert-success');
  44.                     // hide form
  45.                     $(formEl).hide();
  46.                 } else {
  47.                     // display message and set message to disapear after 5 sec.
  48.                     $('#' + messageTagId).addClass('alert-danger').delay(5000).fadeOut('slow');
  49.                 }
  50.                 // Hide spinner and enable inputs again
  51.                 $(spinnerSelector).fadeOut(50);
  52.                 $(submitEl).removeAttr('disabled');
  53.             },
  54.  
  55.             error: function(jqXHR, textStatus, errorThrown) {
  56.                 // Set message and set it to disapear after 5 sec.
  57.                 $(formEl).after('<div id="' + messageTagId + '" class="alert alert-danger">' + jqXHR_error_message + '<div>');
  58.                 $('#' + messageTagId).delay(5000).fadeOut('slow');
  59.                 // hide spinner and enable inputs again
  60.                 $(spinnerSelector).fadeOut(50);
  61.                 $(submitEl).removeAttr('disabled');
  62.             }
  63.         }); //end ajax
  64.     }); //end submit
  65.  
  66. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement