Purging the JavaScript output

Question

Purging the JavaScript output

Currently, I am calling an API and receiving a list of results. These results are then processed into an object for iteration and display.

Below is the function responsible for this process:

    var getAvailability = () => {
        if (chosenData.hotel == "") {
            showError("Please select a location before booking.");
            $timeout(() => LTBNavService.setTab('location'), 50);
            return;
        }

        searchResponse = {};
        console.log(searchResponse);
        WebAPI.getHotelAvailability(genSearchObject()).then((data) => {
            searchResponse = data;
            $timeout(() => $('[data-tab-content] .search-btn').first().focus(), 50);
            generateRoomTypeObject(searchResponse);
        }, (data) => searchResponse.error = data.data.errors[0].error);

    };

The Issue: The previous results remain visible until the new results are loaded, causing an unwanted flicker and delay in user experience.

The proposed solution (requiring assistance): What would be the most effective method to address this issue? Ideally, I aim to clear or reset the search response to display only the newest set of results. Is it feasible to achieve this within the getAvailability function?

How can this best be achieved?

javascript angularjs

Answer 1

Answer №1

The Resolution:

Credit to @Daniel Beck for recommending that I invoke the generateRoomTypeObject function with an empty object, earning a +1 on his helpful suggestion.

Upon following this advice, it became apparent that my generateRoomTypeObject function was throwing an undefined error due to performing length checks on an empty object (which logically resulted in errors). To rectify this issue, I implemented a mechanism to manage the undefined exception by assigning searchResponse to an empty object.

var generateRoomTypeObject = (searchResponse) => {
    var ratePlans = searchResponse.ratePlans,
        errors = searchResponse.error,
        roomTypes = [],
        ignoreBiggerRooms = false;
    rawRoomsObjs = [];
    if (angular.isUndefined(errors)) {
        // Iterate over the rate plan
        if(ratePlans === undefined){   
            //generateRoomTypeObject -- Handle undefined by creating new object
            searchResponse =  {}
        } else {
            for (var i = 0; i < ratePlans.length; i++) {
                var ratePlan = ratePlans[i],
                rooms = ratePlan.rooms;
                // Iterate over the rooms and add rooms to room object. Also keep a list of room types.
                for (var j = 0; j < rooms.length; j++) {
                    //Stuff here
                 }
            }
        }
    }
}

Answer 2

The Resolution:

Credit to @Daniel Beck for recommending that I invoke the generateRoomTypeObject function with an empty object, earning a +1 on his helpful suggestion.

Upon following this advice, it became apparent that my generateRoomTypeObject function was throwing an undefined error due to performing length checks on an empty object (which logically resulted in errors). To rectify this issue, I implemented a mechanism to manage the undefined exception by assigning searchResponse to an empty object.

var generateRoomTypeObject = (searchResponse) => {
    var ratePlans = searchResponse.ratePlans,
        errors = searchResponse.error,
        roomTypes = [],
        ignoreBiggerRooms = false;
    rawRoomsObjs = [];
    if (angular.isUndefined(errors)) {
        // Iterate over the rate plan
        if(ratePlans === undefined){   
            //generateRoomTypeObject -- Handle undefined by creating new object
            searchResponse =  {}
        } else {
            for (var i = 0; i < ratePlans.length; i++) {
                var ratePlan = ratePlans[i],
                rooms = ratePlan.rooms;
                // Iterate over the rooms and add rooms to room object. Also keep a list of room types.
                for (var j = 0; j < rooms.length; j++) {
                    //Stuff here
                 }
            }
        }
    }
}

Purging the JavaScript output

Answer №1

Similar questions

The array contains no elements, yet it is not empty, and when stringified with JSON.stringify, it results

Enhance the functionality of JavaScript for multiple images using ASP.NET

Combining two JSON objects with sailsjs-nodejs to create a single merged object

Performing queries using the ORM Sequelize to fetch data from two separate tables simultaneously during a single page

Using jQuery to apply CSS to elements with multiple potential values

Experiencing a [$compile:multidir] error when attempting to implement a multiselect dropdown with Angular.js

Assign a background image to a button using an element that is already present on the page

obtain a dynamic key to retrieve a corresponding label text

Creating easy nested list views in React Native using object data structures

Tips on importing anime js after it has been successfully installed through npm

"Incorporate keyframes to create a mouseleave event with a distinctive reverse fade

What could be causing the RTCPeerConnection icegatheringstatechange to not function properly?

Enhancing State in React Component through Prop Update

Irreparable Glitches in Mocha

Is there a way to customize the color of a MUI styled component?

Before the async function, make sure to set the value using React's useState

Unable to conceal adjacent element when z-index is set as 1

Mismatch between the format and extension of an HTML table when exporting to Excel

You have exceeded the maximum number of Facebook application requests allowed (#4)

What is the method for defining the maximum selectable month in mtz.monthpicker?