IE11 is throwing a Java script error, while everything seems to be functioning fine in IE9

if ((document.getElementById('position').value != '01') && (document.getElementById('position').value != '04') && (document.getElementById('CkbxSecondment').checked)) {
  alert('The position of the employee is not at the Partner level. Only Active Partners can go on secondment.');

  divElement.style.display = 'none'; // hides
  document.getElementById('CkbxSecondment').checked = false;
}

Error occurs at:

((document.getElementById('position').value != '01') cannot read property 'value' of null)

Answer №1

Internet Explorer has an issue with its implementation of getElementById(id) (which is only fixed when running in standards mode).

In IE, getElementById(id) may return an element with a matching name attribute even though it is not a valid match (if not running in standards mode).

This means that if you are testing in different browsers and one is using a different rendering mode, you might see inconsistent results.

If you are unsure whether there will be a match, always test for the element first.

var rankField = document.getElementById('rank');
if(rankField && rankField.value != '01'){
  //...
}

Answer №2

It is recommended to validate the elements before attempting to access their properties:

if (document.getElementById('rank') && document.getElementById('CkbxSecondeePartner')) {
  if ((document.getElementById('rank').value != '01') && (document.getElementById('rank').value != '04') && (document.getElementById('CkbxSecondeePartner').checked)) {
    alert('The employee's rank is not at the Partner level. Only Active Partners can be on secondment');

    divObj.style.display = 'none'; //hide
    document.getElementById('CkbxSecondeePartner').checked = false;
  }
}

Answer №3

It's disappointing that nobody seems to be addressing the compatibility issue with IE11. The script works perfectly fine on IE 8 or 9, but not on IE11. Many legacy applications relying heavily on JavaScript are facing difficulties.

Instead of (document.getElementById('rank').value != '01')

Try using (document.getElementById('rank') != '01')

This simple change should resolve the issue.

The main problem lies in the fact that implementing this change across a system with 3 million lines of code is extremely challenging, if not impossible.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How to remove a parent element in D3.js once the child transition has completed

How can I use D3.js to animate a child element and then remove the parent element at the end of the animation? Is there a way to know when the transition on the child element has finished? In jQuery, you would do $(this).parent().remove(); to remove the ...

What is the best way to have JavaScript trigger PHP data transfer when a button is clicked or a dropdown menu is opened?

As I work on creating a Notification System for my web application, I find myself navigating through the world of JS/Ajax for the first time. The task at hand is to transmit a variable to my PHP script that will execute an Update operation on the server in ...

Ways to sort choices in a dropdown box using data attributes?

I have a challenge where I need to filter the options in a select box with the id person based on data-attributes selected in another select box with the id invoice_project_id: Here is the HTML: <select id="invoice_project_id"> <option value=" ...

I am encountering an issue with manipulating the x, y, and z axes of my three.js sphere

I am encountering an issue while working with Three.js. I followed a tutorial on YouTube (https://www.youtube.com/watch?v=pUgWfqWZWmM) and my problem arises around the 48-minute mark. The mousemove event to move on the x, y, and z axes is not functioning ...

Step by step guide to sending an object and a variable using Ajax

After successfully implementing this code: $.ajax({ url: 'index.php?route=product/product/quoteProduct', type: 'post', data: $('#product input[type=\'radio\']:checked, #product select), dataType: ' ...

Having a problem with file uploads in node.js using multer. The variables req.file and req.files are always coming

I am encountering an issue with uploading a file to my server, as both req.file and req.files are consistently undefined on my POST REST endpoint. The file I'm attempting to upload is a ".dat" file, and my expectation is to receive a JSON response. ...

Guide on incorporating a texture file (.mtl) onto a model (.obj) with three.js

I've managed to successfully display a .obj file using three.js by adapting code I found online for my project. However, I'm now facing challenges when trying to incorporate the .mtl material file. Despite attempting various solutions, nothing s ...

Ways to verify if a user is currently on the webpage using JavaScript

Is there a way to determine in JavaScript whether the user is currently on the page or on another tab? I want to implement a notification for new messages, but only if the user is not currently on this tab. ...

Confirm the textarea in a form using jQuery

I am working on creating a plugin for an app that allows users to invite their friends via email, similar to how Dropbox offers extra space for referrals. As a newcomer to JQuery, I'm attempting to validate the single textarea field in my form before ...

Is it best practice to contain all side effect logic within useEffect in React?

I am looking to monitor user clicks on a button and send the data to the server. I am considering where to implement the logic for "sending the data to server" within my component. Should I include it inside the onClick handler or should I move it to use ...

Angular custom filter applied only when a button is clicked

I have recently started exploring angular custom filters and I am curious to know if there is a way to trigger the filters in an ng-repeat only upon clicking a button. Check out this example on jsfiddle : http://jsfiddle.net/toddmotto/53Xuk/ <div ...

Error message: "not properly formatted" encountered on Firefox browser, while Chrome browser reports the issue as "XMLHttpRequest.." error

Currently, I am delving into the world of three.js and have successfully converted an .obj file to a .js file for my object. I loaded this object using JSONLoader and was able to view it on Firefox browser. However, a JavaScript exception appeared in the c ...

Changing return values with Jest mocks in TypeScript

Here I am again with a very straightforward example. In summary, I require a different response from the mocked class. Below is my basic class that returns an object: class Producer { hello() { return { ...

Comparing Dates in JavaScript and ASP Classic

Related Query: Using Javascript to compare two dates from strings, ensuring begin is less than or equal to end Newbie here! I've created an HTML form featuring two date input fields that users can populate either manually or with a calendar p ...

Is there a way to prevent the context menu from appearing when tapping on an image on a mobile phone?

When attempting to move an image on the screen with a touch event, a popup appears in Chrome when pressing and holding the image. This popup usually includes options to save the image. Is there a way to disable this popup so I can freely move the image w ...

Using JavaScript in Node, you can pass an object by throwing a new Error

How can I properly throw an error in my node application and access the properties of the error object? Here is my current code: throw new Error({ status: 400, error: 'Email already exists' }); However, when I do this, I get the following outpu ...

The required element was not discovered

Whenever I attempt to execute npm run serve, it reaches 98% completion and then halts, displaying the following error message: An issue occurred while compiling with a total of 1 error: ...

Troublesome button appearance

I set up two sections to gather user information using buttons. My goal is for the button styles to change when clicked, making it clear to users which option they have selected, even if they switch between sections. However, I encountered an issue where ...

Is it possible to Use Vuejs 2 to Update MathJax dynamically?

Just figured out how to resolve this issue. Simply bind the data using v-html <div id="app"> <h1 v-html="equation"></h1> <button @click='change'>Change</button> </div> var vm ...

Introducing the new vs10 IntelliSense feature specifically designed for jQuery, enhancing

When it comes to using JavaScript and jQuery code in vs10, I'm facing challenges with getting intellisense to work. The opening/closing brackets and parentheses aren't being highlighted, let alone autocomplete functionality. In VS08, a patch was ...