Issue with undefined object values in Internet Explorer

Within the workflow of an enterprise application, the following process takes place:

  1. Each service page features a "search box" where users can type something, triggering a call to a Struts 2 action through jQuery autocompleter.
  2. Upon the action call, Hibernate searches for clues based on the user's search in a MySQL database.
  3. When clues are discovered, a JSON response is generated, similar to:

    ...
    "map": {
          "id": "1234",
          "title": "Title 1",
          "permalink": "title-1",
          "class": "contentClassA",
          "contentType": "Content type ..."
        },
    ...
    
  4. On the frontend JSP, JavaScript is used to create a list of <div> elements, each containing data from a map object.

Steps 1-4 function correctly on Firefox versions up to 11 and Internet Explorer up to version 9. However, I encounter an issue when attempting to build a self.location redirect in JavaScript to reload the page based on the value of class. The problem arises when trying to retrieve the class value from the JSON map object using the following code:

    var classType;
    if(obj['class'] != undefined) {
        classType = obj['class'];
    } else {
        //classType = obj.map.class;
        //classType = obj['map'].class;
        //classType = obj.class;
        // ...
        classType = obj.map['class'];
    }

While this code works as expected in Firefox, Internet Explorer (versions 7-8-9) always falls into the else statement, resulting in the classType variable being undefined regardless of the approach used.

Is there something I am overlooking?

Answer №1

It appears that the problem lies with the propertyName "class", as it is a reserved keyword in JavaScript. You can refer to the following link for more information:

I encountered a similar issue with Internet Explorer, and I resolved it by changing the key class to className

Answer №2

It's interesting to consider the purpose behind this logical approach. To determine if obj.map contains a class key, one can utilize hasOwnProperty:

if (obj.map.hasOwnProperty('class')) {
    // handle obj.map['class']
}

If unsure of the presence of map within obj, one can also check for that specifically:

if ('map' in obj && obj.map.hasOwnProperty('class')) {
    //
}

Various methods exist to assess the existence of properties within an object, tailored to the level of data control and specific scenarios to be addressed.

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

Listen for a click event on an Unordered List using addEventListener

Struggling to transform a for loop that iterates through an unordered list of hyperlinks and adds an 'onclick' function to each into one using an event listener instead. Unfortunately, I have not been able to create a functional solution. Below ...

Steps for deploying Nuxt on a subdirectory using either Express JS or Plesk

I have configured my Nuxt (Node.js application) to run on Plesk. This means that Plesk will execute the server.js file, which in turn runs ExpressJS and then Nuxt. Here is the content of my server.js file: const express = require('express') cons ...

Calculate the total price using jQuery

I’m a beginner in JavaScript and I’ve hit a roadblock. I have a plus and minus button that adds up product quantities, but I need the total price to reflect this as well. Some products can only be purchased in multiples of 2, 5 or 10. Here is the HTML ...

Creating a monorepo project in JavaScript that mimics the structure of Visual Studio projects

When working on a typical .NET Core project (with Visual Studio 2019), the structure typically looks like this: Example/ |-- Example.Common/ | |-- FileExample1.cs | |-- FileExample2.cs | `-- Example.Common.csproj |-- Example.WebAPI/ | |-- Control ...

Is it possible to deactivate dynamic binding in Vue.js?

I'm curious if there's a way to disable dynamic binding for a specific instance of an attribute that I'm displaying. Imagine I have the following code, utilizing two-way binding: this.$children[0].$data.hits In this scenario, I have a vac ...

Two pretensions and an evaluation in an if statement

Currently, I am delving into the well-optimized code for voronoi implementation created by Mike Bostock (d3js). I find myself puzzled by the following snippet of code: if (!(m = (halfedges = cell.halfedges).length)) return; You can view the full code he ...

Syntax error occurs while attempting to render the return statement in a React Component

Just starting out with React and encountering a syntax issue that has me stumped. I'm working on a React Component and I thought I had the opening/closing { & }'s correct, but clearly there's something missing based on the error message it&a ...

Utilize a function or array to send various data with an Ajax post request

Hey, I'm on the hunt for a more efficient method to send data using ajax to php for multiple users. Take a peek at my code below: $(document).ready(function(){ $("#all").click(function(){ document.getElementById('babon').click(); ...

Python JSON schema for extracting parameters

Are you searching for a way to parse requests to a specific URL that come in JSON format, but with varying structures? Some may have timestamps noted as timestamp attribute while others use unixtime, among other variations. The goal is to create JSON schem ...

Analyzing past UTC date times results in a peculiar shift in time zones

When I receive various times in UTC from a REST application, I encounter different results. Examples include 2999-01-30T23:00:00.000Z and 1699-12-30T23:00:00.000Z. To display these times on the front end, I use new Date(date) in JavaScript to convert the ...

Tips for fetching a particular item from a getItem dynamoDB in JavaScript

I am trying to retrieve an item from my AWS database. The item 'test2' is printing correctly in my console. However, I want to extract an attribute or variable from this item and store it as a variable named test. How can I accomplish this? For i ...

Problem encountered while using AJAX to load a PHP script, triggered by an onclick event;

My expertise lies in HTML, CSS, JavaScript, and PHP. However, I find myself lacking in knowledge when it comes to jQuery and Ajax. While I work on web design projects involving bars and nightclubs that prioritize style over performance, my current job dema ...

Calculate the overall length of a specified time interval using Node Js

My task involves calculating overtime based on work start and end times. We are looking to calculate overtime hours that fall outside of the regular work schedule. For example, the regular work timings are from 10:00 AM to 07:00 PM Overtime needs to be ...

My Laravel API app stores all JSON output inside a data tag. How can I eliminate this tag from the output?

Currently, I am developing an API using Laravel to generate JSON data for an Android application. While my friend is handling the Android part of the project, we are facing an issue where the app cannot retrieve the data from the API. We suspect that the p ...

Retrieve the highest date value from a collection of objects

Within a React.js component, I have the following array: const data = [{ date: '2017-12-21T07:43:00Z', value: 7000 }, { date: '2017-12-21T09:41:00Z', value: 1500, }, { date: '2017-12-23T10:59:00Z', value: 2000 }] ...

What is the best way to convert JavaScript to JSON in Python programming?

I encountered a situation where I have an HTML page that contains a lengthy product list, making it too large for me to upload. The products are stored within the script section of the page, specifically in one variable. Initially, I mistook this data for ...

Customize dropdown item colors in React using a color picker

I am currently utilizing a react color picker to create a personalized 16 color gradient. The process involves selecting a color from a dropdown menu and then using the color picker to make adjustments. This action updates an array that dictates the stylin ...

What is the best way to send an array of objects to a Jade template?

I'm looking to retrieve an array of objects from MongoDB and pass it to the client... Here is an example object: var objeto_img= { name:'name of the file', ...

A guide on organizing and categorizing data by name with angularjs

Presented here is a list of descriptions associated with specific names. I am seeking guidance on how to group or list the descriptions by name. html: <body ng-app="app" ng-controller="MainCtrl"> <div ng-repeat="nameGroup in loopData"> & ...

Ways to update the content of a NodeList

When I execute this code in the console: document.querySelectorAll("a.pointer[title='Average']") It fetches a collection of Averages, each with displayed text on the page: <a class="pointer" title="Average" onclick="showScoretab(this)"> ...