Question

I’m having a problem with IE, big surprise right? I have a webform that submits name, phone, and email to a script that under another domain. I’m jquery.ajax to submit the form. I’m also using jquery.validate for form validation. name and email are required. phone is optional.

When I submit the form in Chrome, it works perfectly. I receive my thank you email and my data reaches the script on the other domain.

When i try the same form in IE9, I fill in all fields and hit submit and it looks like its submitted (I receive the thank you message where the form is), but none of the data makes it to the service and I don’t get a confirmation email either – so its not actually posting.

So how can i get this script to work in IE7,8,9. Here’s the script as it right now…When I uncomment the alert in the success action, I get the alert in IE. It’s just not posting the data. I’ve seen alot of posts on here about this, but I’m not getting all of the pieces together here in an understandle fashion.

I hear this works straight out of the box with IE10.

jQuery.validator.setDefaults({
submitHandler: function() {

var cons_info_component = jQuery("#cons_info_component").val();
var cons_mail_opt_in = jQuery("#cons_mail_opt_in").val();
var longnum = jQuery("#1540_6383_2_8347_1").val();
var survey_id = jQuery("#SURVEY_ID").val();
var cons_email_opt_in = jQuery("#cons_email_opt_in").val();
var cons_email_opt_in_requested = jQuery("#cons_email_opt_in_requested").val();
var cons_first_name = jQuery("input#cons_first_name").val();
var cons_last_name = jQuery("input#cons_last_name").val();
var cons_email = jQuery("input#cons_email").val();
var cons_phone = jQuery("input#cons_phone").val();

if(cons_phone === "PHONE NUMBER (OPTIONAL)") { cons_phone = ''; }

var ACTION_SUBMIT_SURVEY_RESPONSE = jQuery("#ACTION_SUBMIT_SURVEY_RESPONSE").val();

var dataString = 'cons_info_component='+cons_info_component+'&cons_mail_opt_in='+cons_mail_opt_in+'&1540_6383_2_8347='+longnum+'&SURVEY_ID='+survey_id+'&cons_first_name='+cons_first_name+'&cons_last_name='+cons_last_name+'&cons_email='+cons_email+'&cons_phone='+cons_phone+'&cons_email_opt_in='+cons_email_opt_in+'&cons_email_opt_in_requested='+cons_email_opt_in_requested+'&ACTION_SUBMIT_SURVEY_RESPONSE='+ACTION_SUBMIT_SURVEY_RESPONSE;


jQuery.ajax({   
type: "POST",
url: "http://urlthatIsubmittoo.com/script/",
crossDomain: true,
cache: false,
data: dataString,

statusCode: {
404: function() {
  //alert('page not found');
},
200: function() {
  //alert('success');
}
},
 success: function() {
    //alert('submited');    
},
 complete: function() {

    jQuery('div.convioform').html("<div class='tybox'></div>"); 
    jQuery('div.convioform .tybox').html("<h5 class='webform-title'>Thank You</h5><p>You'll soon be receiving our e-mails and updates now.</p>");
        }
    }); // close .ajax line

},  
 });

Answer 1

Insert this at the top of your file (via github/jaubourg):

if ( window.XDomainRequest ) {
    jQuery.ajaxTransport(function( s ) {
        if ( s.crossDomain && s.async ) {
            if ( s.timeout ) {
                s.xdrTimeout = s.timeout;
                delete s.timeout;
            }
            var xdr;
            return {
                send: function( _, complete ) {
                    function callback( status, statusText, responses, responseHeaders ) {
                        xdr.onload = xdr.onerror = xdr.ontimeout = jQuery.noop;
                        xdr = undefined;
                        complete( status, statusText, responses, responseHeaders );
                    }
                    xdr = new XDomainRequest();
                    xdr.onload = function() {
                        callback( 200, "OK", { text: xdr.responseText }, "Content-Type: " + xdr.contentType );
                    };
                    xdr.onerror = function() {
                        callback( 404, "Not Found" );
                    };
                    xdr.onprogress = jQuery.noop;
                    xdr.ontimeout = function() {
                        callback( 0, "timeout" );
                    };
                    xdr.timeout = s.xdrTimeout || Number.MAX_VALUE;
                    xdr.open( s.type, s.url );
                    xdr.send( ( s.hasContent && s.data ) || null );
                },
                abort: function() {
                    if ( xdr ) {
                        xdr.onerror = jQuery.noop;
                        xdr.abort();
                    }
                }
            };
        }
    });
}