title: Javascript-event listener not working in IE11
body: <p>Is there any workaround for this bug in IE11. The code provided works fine for other browsers and Edge so I was hoping to find a workaround/solution here is the code:</p>
  
  <pre class="lang-js prettyprint-override"><code>document.addEventListener('wpcf7mailsent', function(event) {
    var inputs = event.detail.inputs;
  
    if ('2425' == event.detail.contactFormId) {
      console.log('Test Click');
      var username = document.getElementById('username').value;
      var password = document.getElementById('password').value;
  
      form_data = {
        username: username,
        password: password
      }
  
      $.ajax({
        url: url,
        type: 'POST',
        data: JSON.stringify(form_data),
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function(response) {
          console.log(response);
          localStorage.setItem("api_keyF", response.api_key);
          localStorage.setItem("is_trial", response.is_trial);
          for (i = 0; i &lt; response.user_privileges.length; i++) {
            var service_type_id = response.user_privileges[i].service_type_id;
            localStorage.setItem("serviceid" + service_type_id, service_type_id);
          }
  
          /**alert(response.api_key + ' ' + response.user_privileges{service_type_id});*/
  
          window.location.href = "login-services/";
        },
        error: function(response) {
          console.log(response.responseJSON.message);
          //                var message = '&lt;div class="alert alert-content-danger row"&gt;';
          // toastr.error(response.responseJSON.message);  
          // $('#username').addClass('error-border');
          // $('#password').addClass('error-border');
          // $('.username').text(response.responseJSON.message);                  
          // $('.password').text(response.responseJSON.message);          
  
          // document.getElementById("displayerror").style.display = "block";
          // document.getElementById("loginban").style.display = "block";                     
          // document.getElementById('displayerror').innerHTML = response.responseJSON.message;
  
          errorsoftlock = response.responseJSON.message;
  
          if (errorsoftlock == "Your account is locked. Please wait for 5 minutes.") {
            document.getElementById("displayerror").style.display = "block";
            document.getElementById("loginban").style.display = "block";
            document.getElementById('displayerror').innerHTML = "Oops! Your account has been temporarily locked. Please wait for 5 minutes before trying again.";
          } else {
            document.getElementById("displayerror").style.display = "block";
            document.getElementById("loginban").style.display = "block";
            document.getElementById('displayerror').innerHTML = response.responseJSON.message;
          }
          //                  $('.testerror').html(response.responsetesterrorJSON.message);
          //document.getElementsByClassName("testerror").innerHTML = response.responseJSON.message;
        }
      });
    }
  }, false);
  </code></pre>
  
  <p>the expected behavior would be once I click on the button it would make an api call and redirect me to a homepage. this is true for browsers except IE11. In IE11 i am able to click the button but nothing happens. I have also tried using 
  attachEvent() reading about possible workarounds but this does not work as well. hoping to find a possible solution for this issue.</p>