Save selected colors even by going to another page

Asked

Viewed 48 times

0

Any idea how to have 2 (options) arrays with styles to change colors in specific site locations (for example change 3 classes: .header, .footer, .sidebar), but keep the option on which the user clicked even when he went to another page on the site?

javascript jquery angularjs

  • ng-route changing the content of the page, but not changing the address. There is another easier way but it is not recommended because it does not work with Search Engines, etc.

  • uses cookies or localstorage to save these options

  • @DH. Thank you for answering, do you have an example? Angularjs' Ng-Route is more complex than with jquery/ javascript using cookkies/localstorage as Gabriel Rodrigues suggested?

  • is just to display how it would look with other colors the template

  • @DH. which is the easiest way?

  • You can also use cookies to maintain these options if you haven’t prepared your website to use ng-route or the alternative way of it(sorry but I forgot the name of the function, I would have to look at my sources at home), cookies are a good quick exit

Show 1 more comment

1 answer

1

An easy way to do this would be using the $rootScope But beware, it is not advised to save functions/methods here, only data.

You can inject the dependency into your controller where the user chooses the colors:

myApp.controller('colorChangeCtrl', ['$scope' $rootScope, function($scope, $rootScope) {
    $rootScope.colors = {
        header: '#fff',
        sidebar: 'rgb(156,236,148)',
        footer: 'alice-blue'
    };
}]);

and then you can access $rootsScope from any injected 4th controller and receive the values normally:

myApp.controller('otherCtrl', ['$scope' $rootScope, function($scope, $rootScope) {
    $scope.chosenColors = $rootScope.colors;
}]);

You can also use a service, localstorage, cookies and even Routes, but I think this is the fastest way and requires less knowledge to be applied. But if you are looking to add knowledge I suggest you look for these other alternatives.

Browser other questions tagged javascript jquery angularjs

You are not signed in. Login or sign up in order to post.