Using AngularJS to manage cookies along with arrays

I am passing my data in this way

$cookies.putObject("currentLocation,values,allLocList", obj, vm.tempData, vm.allLocationList);
The objects obj and vm.tempData are being sent as objects, while vm.allLocationList is an array that contains a JSON object.

When retrieving the data in my state file:

  resolve: {
  entity: function($cookies) {
    return {
      location: $cookies.getObject("currentLocation"),
      values: $cookies.getObject("values"),
      allLocationList: $cookies.getObject("allLocList")
    };
  }
}

Upon reaching the controller, entity.location and entity.values display correctly, but entity.allLocList appears to be undefined. Any suggestions on how to fix this?

javascriptangularjscookies

Answer №1

To save your data, use the syntax 

$cookies.putObject(key, value, [options]);
- check out the $cookies documentation:

Add your values individually (key, value):

$cookies.putObject("currentLocation", obj);
$cookies.putObject("values", vm.tempData);
$cookies.putObject("allLocList", vm.allLocationLis);

Retrieve your saved values

resolve: {
  entity: function($cookies) {
    return {
      location: $cookies.getObject("currentLocation"),
      values: $cookies.getObject("values"),
      allLocationList: $cookies.getObject("allLocList")
    };
  }
}

> For a demonstration, visit this Fiddle link

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 can JavaScript/jQuery be used to update LocalStorage Objects when editing a form?

Having trouble pinpointing an issue with my code. Despite making modifications, the values in localStorage are not updating as expected. Any suggestions on what may be causing this problem? Note: Changing const idx to const i resulted in only the final va ...

javascriptjqueryarraysjsonlocal-storage

Deciphering JSON information extracted from a document

I am currently working on a Node JS project where I need to read a file containing an array of JSON objects and display it in a table. My goal is to parse the JSON data from the array. Below is a sample of the JSON data: [{"name":"Ken", "Age":"25"},{"name" ...

javascriptnode.jsjsonexpress

JqueryUI Autocomplete functions flawlessly on JSFiddle but fails to work on the actual website

After spending hours working on it, I still can't seem to figure it out. The code functions perfectly on JSFiddle, but not on my own website. Here is the link to the JSFiddle: http://jsfiddle.net/x69chen/sbAR6/16/ I've also included the links ...

javascriptjqueryjquery-uiautocompletejquery-autocomplete

The resize function fails to trigger when it is required

Struggling to get this code working properly. If the window width is greater than 800, I want 6 images with a red background. If the window width is less than 800, I want 4 images with a blue background. I need this functionality to work both on r ...

javascriptjquerycss

The specified file for import cannot be located or is unable to be read: node_modules/bootstrap/scss/functions

I am currently using core UI version 2.1.1 along with react. Upon attempting to execute npm start, I encountered the following error: (/Users/umairsaleem/Desktop/abc/abc/node_modules/css-loader??ref--6-oneOf-5-1!/Users/umairsaleem/Desktop/abc/abc/node_mo ...

javascriptreactjscore-ui

Changing the text during a reset process

I've been grappling with this issue, but it seems to slip through my fingers every time. I can't quite put my finger on what's missing. My project involves clicking an image to trigger a translate effect and display a text description. The ...

javascripthtmlcss

Using Ajax to submit two forms by clicking a submit button

Explanation : In this particular scenario, I am facing a challenge where I need to trigger another Ajax function upon successful data retrieval, but unfortunately, I am encountering some unknown obstacles. Code: ---HTML Form : <form accept-charset=" ...

javascriptphpjqueryhtmlajax

execute a synchronous function within a promise

Recently diving into the world of JavaScript and asynchronous operations, I found myself working on a Node.js router with Express that pulls weather data from MongoDB using Mongoose. This data is collected from various sites at 15-minute intervals and proc ...

javascriptnode.jsexpressmongoosepromise

When you attempt to "add website to homescreen" on an iPhone, Ajax malfunctions

I have a unique website feature that utilizes ajax to dynamically load content when the user interacts with certain buttons. Everything functions smoothly up until a user tries to access the website through the "add to homescreen" option on mobile Safari a ...

javascriptjqueryiphoneweb-applicationsmobile-safari

Utilizing AngularJS to showcase and verify a form field populated by JSON data

I am looking to set up a form with validation and a submit button. As a beginner in Angular, I'm not entirely sure where to start. - I need some guidance on what Controller to use or perhaps a starting point. JS: myApp.controller('jsonCtrl&a ...

javascriptangularjsjson

Trigger JavaScript when a specific division is loaded within a Rails 4 application

Is there a way to trigger a JavaScript function when a specific div with a certain class is loaded within my Rails 4 application? <div class="myClass"> hello world </div I am looking for a solution to execute some JavaScript code only when t ...

javascriptjqueryruby-on-railsruby-on-rails-4

Accessing the ViewModel property of a parent component from the ViewModel of its child in Aurelia

Having a scenario with two distinct components: <parent-component type="permanent"> <div child-component></div> </parent-component> class ParentComponentCustomElement { @bindable public type: string = "permanent"; } clas ...

javascripttypescriptaurelia

Preventing AJAX/hash functionality for specific links exclusively within jQuery Mobile

I've come across some outdated solutions for this issue, but it seems they are no longer applicable to jQuery Mobile. My goal is to disable the AJAX/hashbang behavior for specific links only. I know that I can disable it globally like this: /** * ...

javascriptjqueryajaxjquery-mobilehashbang

New feature in jQuery inputmask enables placeholder text to be retained

I have integrated the inputmask feature from https://github.com/RobinHerbots/jquery.inputmask in my project, and I am applying the mask to all textboxes with the class "date". However, I am encountering a problem where if the user leaves one or more letter ...

javascriptjquery

Parsing JSON data in JavaScript

I am facing an issue with parsing JSON using JavaScript. After the completion of the loop, my variable 'text' is not getting the expected result. Can someone please explain how I can correctly parse this JSON? var xmlr = null; var text = '& ...

javascriptjson

Tips for enabling browser back and forward functionality in a one-page website design

Building on the previous discussion about optimizing a horizontal sliding layout (Most efficient way to do a horizontal sliding layout), I'm curious if it's feasible to enable the back and forward buttons in the browser when implementing a single ...

javascripthtmlbrowsercross-browseruser-experience

AngularJS controller is being passed $http without any explicit definition

As someone new to Angular, I have found myself struggling to grasp the concept of using $http in controllers. I understand its purpose and that it should be injected into the controller rather than written out directly for the sake of keeping them light. ...

angularjs

Manipulating images live with options for scaling, resizing, and cropping

I am currently developing a content management system that allows users to upload images and attach them to different sections of the pages. My goal is to find a user-friendly, preferably jQuery-based plugin for resizing images before they are cropped. A ...

javascriptjqueryimagegd

"By selecting the image, you can initiate the submission of the form

I am trying to figure out why clicking on the image in my form is triggering the form submission by default. Can someone please provide guidance on this issue? <form name="test1" action="er" method="post" onsubmit="return validateForm()" <input ty ...

javascripthtmlforms

Struggling to integrate buttons into an h2 element with the use of createElement() and appendChild() in HTML/CSS/JS

As I work on developing a website, one of the features I've been implementing is the ability for users to add books to a list and then review or delete them. The process was smooth sailing until I reached the point of adding buttons for these actions. ...

javascripthtmlappendchildcreateelementcreatetextnode