The Add and Update functions of an AngularJS application are malfunctioning in Internet Explorer

Encountered a situation where updates and additions in IE show results in Chrome :D

// Extract category object and id from the parent
    $scope.addNewCategory = function (category, parentId) {
        $scope.resetError();
        category.parentId = parentId.id;

        $http.post('/guardian/springmvc/categories/addCategoryValue', category).success(function () {
            $scope.retriveCategoryValues(parentId);
            $scope.category.parentId = '';
            $scope.category.name = '';
            $scope.category.description = '';

        }).
            error(function (data, status, headers, config) {
                // execute this block if an error occurs asynchronously 
                // or server responds with an error status.
                $scope.setError('Could not add new category');
                console.log(data);
            });
    };

    // Extract category value object and id from the parent
    $scope.editCategoryValue = function (categoryValue, parentId) {
        $scope.resetError();
        categoryValue.id = categoryValue.id;
        categoryValue.parentId = parentId.id;
        $http.put('/guardian/springmvc/categories/updateCategoryValue', categoryValue).success(function () {
            $scope.retriveCategoryValues(parentId);
            $scope.categoryValue.parentId = '';
            $scope.categoryValue.id = '';
            $scope.categoryValue.name = '';
            $scope.categoryValue.description = '';
            $scope.editMode = false;
        }).
            error(function (data, status, headers, config) {
                // execute this block if an error occurs asynchronously
                // or server returns response with an error status.
                $scope.setError('Could not update category');
                console.log(data);
            });
    };

Refer to Rest Controller code provided below.

In Chrome, Insert and Update operations are functioning correctly.

/**
 * Creates a new category.
 * @param created The information of the category to create.
 * @return The created category.
 */
@RequestMapping(method = RequestMethod.POST, value = "/addCategoryValue", produces = "application/json")
public
@ResponseBody
OrgCategoryDTO addNewCategory(@RequestBody OrgCategoryDTO categoryToCreate) {
    try {
        if(LOGGER.isInfoEnabled()) {
            LOGGER.info("CategoryController: calling categoryService's create");
        }
        if(categoryToCreate != null)
        return categoryService.create(categoryToCreate);
    } catch (Exception e) {
        LOGGER.debug("Exception  " + e);
    }
    return new OrgCategoryDTO();
}

/**
 * Updates the information of a category.
 * @param updated The information of the category to update.
 * @return void.
 */

@RequestMapping(method = RequestMethod.PUT, value = "/updateCategoryValue", produces = "application/json")
public
@ResponseBody
void updateCategory(@RequestBody OrgCategoryDTO categoryToUpdate) {
    if(LOGGER.isInfoEnabled()) {
        LOGGER.info("CategoryController: calling categoryService's update");
    }
    try {
        if(categoryToUpdate != null)
        categoryService.update(categoryToUpdate);
    } catch (Exception e) {
        LOGGER.debug("Exception  " + e);
    }
}

Server Logs for Update action

SUCCESSFULLY LOADED validation.properties via the CLASSPATH from '/ (root)' using current thread context class loader!
Hibernate: select orgcategor0_.CATEGORY_ID as CATEGORY1_0_0_, orgcategor0_.CMS_TIMESTAMP as CMS2_0_0_, orgcategor0_.DESCRIPTION as DESCRIPT3_0_0_, orgcategor0_.ENABLED as ENABLED4_0_0_, orgcategor0_.ROW_TIMESTAMP as ROW5_0_0_, orgcategor0_.CATEGORY_LEVEL as CATEGORY6_0_0_, orgcategor0_.NAME as NAME7_0_0_, orgcategor0_.CATEGORY_TYPE as CATEGORY8_0_0_ from ORG_CATEGORY orgcategor0_ where orgcategor0_.CATEGORY_ID=?
Hibernate: update ORG_CATEGORY set CMS_TIMESTAMP=?, DESCRIPTION=?, ENABLED=?, ROW_TIMESTAMP=?, CATEGORY_LEVEL=?, NAME=?, CATEGORY_TYPE=? where CATEGORY_ID=?

Server logs for Insert Action

Hibernate: select orgcategor0_.CATEGORY_ID as CATEGORY1_0_0_, orgcategor0_.CMS_TIMESTAMP as CMS2_0_0_, orgcategor0_.DESCRIPTION as DESCRIPT3_0_0_, orgcategor0_.ENABLED as ENABLED4_0_0_, orgcategor0_.ROW_TIMESTAMP as ROW5_0_0_, orgcategor0_.CATEGORY_LEVEL as CATEGORY6_0_0_, orgcategor0_.NAME as NAME7_0_0_, orgcategor0_.CATEGORY_TYPE as CATEGORY8_0_0_ from ORG_CATEGORY orgcategor0_ where orgcategor0_.CATEGORY_ID=?
Hibernate: select childcateg0_.FK_ORG_CATEGORY_ID as FK5_0_2_, childcateg0_.CATEGORY_IMPCATEGORY_ID as CATEGORY1_2_2_, childcateg0_.CATEGORY_IMPCATEGORY_ID as CATEGORY1_2_1_, childcateg0_.FK_ORG_IMP_CAT_ID as FK4_2_1_, childcateg0_.CMS_TIMESTAMP as CMS2_2_1_, childcateg0_.ROW_TIMESTAMP as ROW3_2_1_, childcateg0_.FK_ORG_CATEGORY_ID as FK5_2_1_, orgcategor1_.CATEGORY_ID as CATEGORY1_0_0_, orgcategor1_.CMS_TIMESTAMP as CMS2_0_0_, orgcategor1_.DESCRIPTION as DESCRIPT3_0_0_, orgcategor1_.ENABLED as ENABLED4_0_0_, orgcategor1_.ROW_TIMESTAMP as ROW5_0_0_, orgcategor1_.CATEGORY_LEVEL as CATEGORY6_0_0_, orgcategor1_.NAME as NAME7_0_0_, orgcategor1_.CATEGORY_TYPE as CATEGORY8_0_0_ from ORG_CATEGORY_MAP childcateg0_ left outer join ORG_CATEGORY orgcategor1_ on childcateg0_.FK_ORG_IMP_CAT_ID=orgcategor1_.CATEGORY_ID where childcateg0_.FK_ORG_CATEGORY_ID=?
Hibernate: insert into ORG_CATEGORY (CMS_TIMESTAMP, DESCRIPTION, ENABLED, ROW_TIMESTAMP, CATEGORY_LEVEL, NAME, CATEGORY_TYPE, CATEGORY_ID) values (?, ?, ?, ?, ?, ?, ?, ?)
Hibernate: insert into ORG_CATEGORY_MAP (FK_ORG_IMP_CAT_ID, CMS_TIMESTAMP, ROW_TIMESTAMP, FK_ORG_CATEGORY_ID, CATEGORY_IMPCATEGORY_ID) values (?, ?, ?, ?, ?)

Answer №1

Implemented the instructions outlined in https://docs.angularjs.org/guide/ie Followed each step carefully as provided in the link above and successfully resolved the compatibility issue with IE browser.

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

Non-functioning Tooltips on Google Charts

Currently, I am working on integrating Google Chart with ASP.NET and linking it to a SQL Server database. I have encountered an issue while attempting to customize the tool tip. Below is the Header Code: <script src="js/jquery/jquery-1.10.2.js" type=" ...

Developing a personalized Avada form auto-scrolling algorithm

Our form, created using the Wordpress - Avada theme, needs an autoscroll feature. As users answer questions, the next question appears below, but this is not immediately visible on mobile devices. To address this, we require autoscroll functionality. The ...

Attempting to transmit JavaScript information to my NodeJS server

Having some trouble sending geolocation data to NodeJS through a POST request. When I check the console log in my NodeJS code, it's just showing an empty object. I've already tested it with postman and had no issues receiving the data. The probl ...

Is d3 Version pretending to be a superior version?

I have encountered an issue with my project that involved using d3 v5.5.0. After transferring it to a different computer and running npm install, the application now seems to be recognizing d3 as a higher version? A crucial part of my program relies on th ...

"Encountering a 404 error while trying to refresh

I've already attempted to include <base href="/index.html"> and/or <base href="/"> My .htaccess configuration is as follows: Options +FollowSymLinks <ifModule mod_rewrite.c> RewriteEngine On RewriteCond %{REQUEST_FILENAME ...

Problem encountered when transferring JSON data to PHP for file writing

After spending numerous hours researching potential solutions, I still can't seem to fix the issue at hand. Admittedly, I am fairly new to PHP, so it's possible that I am overlooking a small detail. The problem lies in the fact that I have a form ...

Discover the security vulnerabilities in Node.js when using VS Code with FREECODECAMP's React app

As a beginner in using VS code, I attempted to work on a project for FREECODECAMP. This project involved creating a random quote machine, marking my first time coding a react project. While following a YouTube tutorial and making progress towards functiona ...

How can I utilize JavaScript on the server-side similar to embedding it within HTML like PHP?

One aspect of PHP that I find both intriguing and frustrating is its ability to be embedded within HTML code. It offers the advantage of being able to visualize the flow of my code, but it can also result in messy and convoluted code that is challenging to ...

The specified project directory was not detected. Please restart Next.js in your updated directory

I am facing a challenge with running my NextJS web app on a VPS server with PM2 as the Process Management tool. Despite trying different approaches, I am unable to get it to run properly. I have a deploy.js file that successfully deploys my other NextJS an ...

Which comment widget/platform does 9GAG utilize?

I am in the process of developing a new website and I am looking for a comment system to use. The comment system that 9GAG is currently using really catches my eye. Take a look at this random post as an example: Despite searching through their source code ...

I'm perplexed by the inner workings of infinite ajax scroll in fetching additional posts

As someone who is new to JavaScript, I find it challenging to grasp the concept, especially when incorporating it with HTML. Despite this, I decided to experiment with infinite ajax scroll functionality. Below is my code snippet: var ias = jQuery.ias({ ...

Master the Art of Transforming an Array into a Variable

Here is an example of an array: const [listArr, setLA]= useState([ { id: Math.floor(Math.random * 100000), data: "This is data 1", }, { id: Math.floor(Math.random * 100000), data: "This is data 2", ...

How can I properly choose distinct values for an individual attribute from a JavaScript array containing objects?

Let's imagine a scenario with an array of JavaScript objects like this: var data = [ {category : "root", type: "qqqqq", value1: "aaaaa", value2: "zzzzz"}, {category : "root", type: "qqqqq", value1: "aaaaa", value2: "xxxxx"}, {category : " ...

String casting for large JavaScript integers may require rounding to function properly

When trying to pass a large integer to a function from an onclick event in HTML, I always encounter issues with rounding. Despite using bigInt libraries, I still struggle to pass the full number accurately and would prefer a simple string casting method. ...

Associate information with HTML elements

I've come across this question multiple times, but the solutions are mostly focused on HTML5. My DOCTYPE declaration is: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> I'm looking t ...

Is it possible to process HTML and JavaScript as a request in JMeter?

After receiving a response, I noticed that the HTML body contains a hidden form along with an internal JavaScript function to submit the form (view snapshot here). Is there a method in JMeter to execute JavaScript code that directly submits a form? I am ...

Only one controller is triggering the $on event

I have a controller with an event named changeSafe. I want other controllers to be able to listen for this event. secure.controller('wrapperCtrl', function ($scope, $rootScope, storeFactory, safeFactory) { $scope.changeSafe = function (s ...

New to Angular: Getting Started with NgModel Binding

Novice query: I am facing an issue with a simple input type=text element linked to ng-model="xyz.zyx", where xyz refers to an object. In my controller, I initialize this object and set the value for the property zyx as shown below: xyz { zyx: $scope.zz ...

Dragging additional events into FullCalendar is disabled after applying a filter to external events

I am encountering an issue while attempting to drag events from the external events box to the fullcalendar. To replicate the problem, you can visit this CodePen: Initially, dragging an external event into the calendar works smoothly. However, after appl ...

What caused the sudden malfunction in the extended Express Request?

Currently, I am utilizing Node v12 along with Express v4.16.4 and Typescript version 3.8.3 within VSCode. This particular snippet of code has remained unchanged for almost 8 months and is utilized in all our routers. export interface ICustomRequest exten ...