Question

For some reason my form is working in every browser but Internet Explorer.

Here is the HTML: This was designed by someone other than me.

    <label for="name">Name:</label><br />
    <input name="name" type="text" /><br />
    <label for="address">Address:</label><br />
    <input name="address" type="text" /><br />
    <label for="phone">Phone:</label><br />
    <input name="phone" type="text" /><br />
    <label for="email">Email:</label><br />
    <input name="email" type="text" /><br />
    <input class="button" name="submit" style="margin-top:10px;" type="button" value="Join Club" /></div>

Here is the JavaScript: This was designed by someone other than me.

    <script type="text/javascript">
    ///////////////////////////////////////////////ARRAY DUMP FUNCTION
    function dump(a,b){var c="";if(!b)b=0;var d="";for(var e=0;e<b+1;e++)d+="            ";if(typeof a=="object"){for(var f in a){var g=a[f];if(typeof g=="object"){c+=d+"'"+f+"' ...\n";c+=dump(g,b+1)}else{c+=d+"'"+f+"' => \""+g+'"\n'}}}else{c="===>"+a+"<===("+typeof a+")"}return c}
  /////////////////////////////////////////////
$(document).ready( function() {
    $('.clubregister  input[name="submit"]').click( function(event) {
        event.preventDefault();
                    /*alert('This section is under construction, please contact us to get set up!\n Sorry for the inconvenience');return false;*/
        //CREATE ARRAY FROM FORM DATA SERIALIZED
        var $formData = $('.clubregister input[type="text"], .clubregister textarea').serializeArray();
        //PUSH ACTION TO ARRAY
        $formData.push({'name':'action','value':'registerForClub'});
        //SEND DATA TO HANDLER
        $.ajax({
            url:'http://torkliftcentralrv.com/club_register_handle.php',
            dataType:'json',
            async:false,
            data:$formData,
            success: function(data) {
                //console.log(dump(data));
                //CREATE MESSAGE
                var message = '';
                var consolemessage = '';
                //IF ERRORS
                if(typeof data['error'] !== 'undefined') {
                    //APPEND ERRORS TO MESSAGE
                    $.each( data['error'], function( index,data) {
                        message += (data + "\n");
                    });
                }
                //IF MESSAGES
                if(typeof data['message'] !== 'undefined') {
                    //APPEND MESSAGES TO MESSAGE
                    $.each( data['message'], function( index,data) {
                        message += (data + "\n");
                    });
                }

                //IF CONSOLE MESSAGES
                if(typeof data['console'] !== 'undefined') {
                    //APPEND CONSOLE MESSAGES TO MESSAGE
                    $.each( data['console'], function( index,data) {
                        consolemessage += (data + "\n");
                    });
                }
                //IF SUCCESS SENT FROM SERVER
                if(typeof data['success'] !== 'undefined') {
                    //CLEAR FORM
                    $('.clubregister input[type="text"], .clubregister textarea').val('');
                }
                alert(message);
                console.log(consolemessage);
            }
        });
    });
});

Any Ideas?

Answer 1

You are trying to do a cross-domain Ajax request. IE8 and IE9 have support for cross-domain requests, but they use a custom API, XDomainRequest, which has several limitations.

Namely, #4 from the linked document: “Only text/plain is supported for the request’s Content-Type header“. You are asking for JSON, but you cannot send Content-Type: text/json using XDomainRequest.

Try removing the dataType:'json' line and adding data = $.parseJSON(data) to the first line of your success handler.