AJAX Subscription Form

I'm encountering some issues with the AJAX Subscription Form.

My form has two fields, an email field and a device type field which has 2 radio buttons (iOS and Android). At the minute the form submits whenever the email is filled in even though the device type is empty.

Is there a way to ONLY submit the form when I have the both the fields filled in?

Here's the code I'm using. I've tried checking if all the input fields are empty but I don't think it's working.

$('input').each(function() {
    if ($(this).val() == '') {
      isFormValid = false;
    }
  });
    
  if (isFormValid) {
    $('#subForm').submit(function (e) {
           
      e.preventDefault();
      $.getJSON(
      this.action + "?callback=?",
      $(this).serialize(),
      function (data) {
        if (data.Status === 400) {
                    
          // alert("Error: " + data.Message);
        
        } else { // 200
                    
          // alert("Success: " + data.Message);
          
          $('.cards, #subForm').slideUp(400);
          $('.rare-card').slideDown(400);
          
        }
      });
            
    });
  }
roshodgekiss roshodgekiss, 4 years ago

Hey there kachunchau, the best way to go about this is to add your own client-side validation, so the form doesn't submit unless all fields are filled in. Here's a great example to help get you started.


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor
kachunchau, 4 years ago

Hey,

I can get the Validate Plugin to validate before submit but on completion it directs me to a separate page which I do not want.

Here's the code?

$('#subForm').validate({
  errorElement: "span",
  errorPlacement: function(error, element) {
    error.insertBefore(element.prev());
  },
  submitHandler: function(form) {
    $(this).ajaxSubmit({
      type:      'POST',
      url:       'http://acountname.createsend.com/t/r/s/ykdkzy/',
      data: dataString,
      dataType:  'jsonp',
      success: function(data) {
        if (data.Status === 400) {
        } else { // 200          
          $('.cards, #subForm').slideUp(400);
          $('.rare-card').slideDown(400);
        }
      }
      
    });
  }  
});

Any help would be great.

Thanks.

200,000 companies around the world can't be wrong.

From Australia to Zimbabwe, and everywhere in between, companies count on 
Campaign Monitor for email campaigns that drive real business results.

Get started for free
1-888-533-8098