Internet Explorer 11-AJAX呼叫未触发

Question

I am stuck in the middle of a bug. I began to use BrowserStack to validate my current project against Windows IE and EDGE and I got a particular issue with IE 11.

I first got an issue that I solved which was that FormData did not have any .get() methods, and I used the NPM formdata-polyfill for that.

I am working on a native JS login form, using FormData and XMLHTTPRequest, and it seems that the AJAX call is not firing at all.

When clicking on the submit button, instead of sending to my particular login URL, the POST request is fired to the current page itself.

So, obviously, no event is catched and no JavaScript is executed.

My JavaScript is compiled using WebPack, and the lines I use to get the login form and attach proper events to it are the following :

    var formLogin = document.querySelector( "#form-login" );

    if ( formLogin !== null )
    {
        var email    = document.getElementById( "email" );

        formLogin.addEventListener( "submit", _.validateLoginForm );
        _.formInstance.init( formLogin );

        _.inputUtil.disableField( '#btn-submit-email' );
        _.inputUtil.disableField( '#btn-submit-password' );

        utils.addAndDispatchEvent( '#email', 'input', _.inputUtil.disableSubmitIfFieldIsEmpty( '#btn-submit-email' ) );
        utils.addAndDispatchEvent( '#password', 'input', _.inputUtil.disableSubmitIfFieldIsEmpty( '#btn-submit-password') );

        email.addEventListener( "invalid", _.onInvalidEmail );
    }

```

The JS file is properly loaded to.

I do not get where it can come from as it works well on any others browsers ( including Edge after I got the polyfill ).

If you have any ideas, let me know !

Thanks for listening.

Answer 1

My issue here was that I needed to override my call to different e.preventDefault() by e.preventDefault ? e.preventDefault() : ( e.returnValue = false ); e.preventDefault ? e.preventDefault() : ( e.returnValue = false );

Which is better supported on IE.

Got this information from the following post : event.preventDefault() function not working in IE

Then I got aditionnal issues with the Event and CustomEvent class not properly supported so I added a few polyfills by adding Babel Transpiler to avoid using ES2015 but compatible JS.

Still having some issues with supporting IE 11 completely but this one is fixed.