Controller Properties ASP.NET Core - angularjs

Have 2 pages for one long process. Both in one controller. My problem is:
In first page, using angular - run method that generate some data. Store that data in property in controller. Move to another page, using angular - run another method and that is... my data in property is null. Is there a solution to store data in controller properties in thid situation?

New instance of a controller is created on every request so whatever you save in property of your controller this will be destroyed together with a controller when request is ended. You have to store this data either on client(cookie, local storage) or server side (session, cache, database etc.).

With ASP.Net MVC, you can't store data in a property between 2 actions.
For achieving this, you have to use cache strategy.
Please, see this link.

Related

How to load Spring MVC view without reloading js files in it

I have 3 JSP views which all use the same JS file(say app.js).
My UI is on AngularJS which has a different controller for each of the JSP views and also has a custom service which shares information between the controllers. When I load the first JSP, its controller specified in the app.js file saves a value in the custom service. When I load the next JSP file, app.js gets reloaded and so the value that was saved in the custom service is lost.
Is there a way to not re-load JS files? Or is there a better way to go about this?
If you have no control on the server , you can save the data in browser's session storage object to keep data across requests and clean it, when you are done. https://developer.mozilla.org/en/docs/Web/API/Window/sessionStorage
// Save data to sessionStorage
sessionStorage.setItem('key', 'value');
// Get saved data from sessionStorage
var data = sessionStorage.getItem('key');
// Remove saved data from sessionStorage
sessionStorage.removeItem('key')
Javascript variable are not automatically preserved. When you open a new URL in your browser, you do not download again the JS files (they are cached), but they are loaded from scratch in that new page. That means that all previous values are lost, not by accident but by design.
You have different ways to deal with this persistence between page question. One way is server side by using the session:
the js part sends the value to save as parameters of a request
a spring-mvc controller puts that in the session
other views (jsp) or controllers (spring) access the saved value and pass it in the responses
An alternate way is the single page application pattern:
you only load one single full page from the server
the javascript then only sends requests that it processes directly to modify the DOM
Additionally, you could use Windows.sessionStorage to store data client side for the duration of a client session - credits should go to #AmitParashar for this one, more details in his answer.
You can of course mix the 2 patterns (this is commonly done in real world applications), but you must know that every page load will erase all client javascript state
A less common pattern (AFAIK) is to put the state in a cookie. That way it can be shared by the server and the client but:
it is limited to 4k size
you cannot use it for server side security, because it can too easily be forged

In angular how do i share data on a session basis

So my understanding is that factories are singletons so any stateful data for a session would be ill placed here.
My next point of call was a service which returns a new instance of the service when injected however I am unsure how I would share one instance of the service to multiple controllers.
Is this an accepted way to solve this issue or does angular provide a better way?
My current use case is that I have a view with some partial views (each partial has it's own controller) and a modal window which takes in a row id and will display data dependant on that data.
I need to be able to share a instance of the service (or equivalent) across these controllers but on a per session basis.
How is this best done?
The singleton exists for one user and loaded SPA. Thats what you would usually refer to as a session. Its a good place to store data that needs to be accessed by different controllers.

Advice on where to store and save angular data

I'm building a wizard-config app with 3 pages. Each page has the same MasterController but different html templates. Each html templates has a different controller, say ControllerOne, ControllerTwo, and ControllerThree.
I load the data via MasterController and I'd like the data and any changes the user makes to be stored temporarily until the save & finish step on the final page. Trouble is as the user goes through the pages, MasterController is called each time and each time it fetches the data and overwrites the user's changes.
I've thought about attaching this data to a service or rootScope but the data initialization still happens in MasterController so the data would still be overwritten when each view is loaded.
Any advice on how I should go creating this functionality or restructuring my app to support this?
EDIT:
To be clear on the service issue. I don't know where to initialize it. If I do it in Controllers 1,2 or 3 my data is reinitialized each time the view changes so that doesn't work. I can't do it in app.run() either because I need to get to MasterController in order to get the necessary ID to make my HTTP request. I can't do it in MasterController because that too is called on each page switch.
Ideally I'd have a view within a view so that only the inner view changes. However angular does not support nested views and I'm trying to find a way around this without having to use angularUI.
To get around the data being loaded from the server on each page change and overwriting the user data, I used an "extend" function (like jQuery's) to extend the server data with the user data on each load. Page changes would call my service(that stores the temporary data) to save the data there and the final "save and finish" button would push the data in the service to the server.

CakePHP: View without model from external API

I need help directing me to the best way to accomplish this. I have a third party API that I want to use for data. I want to call the API using AJAX to display information only when necessary so that I don't have to store it in the database.
I'd like to have a separate view or element so that the view is set up and the data returned can be placed into the view.
Should I create a controller to do this? Can you have a controller without a model? I'm sure this is not an ideal MVC method but I don't really know the best way.
What you write does not make any sense at all:
I want to call the API using AJAX to display information
You do not need anything on the php server side when you do an AJAX call to a 3rd party site. Your server and Cake app is not even called in this case. Just modify the returned data as needed and injected it in the DOM tree where needed.
Can you have a controller without a model?
Yes
public $uses = array();
If you would not want to use AJAX, MVC wise it would be the best to create a Datasource for the API and use it together with a model. The example on this page shows a complete implementation of using data from a remote source.

How can I use Backbone.Model.save() if my whole app and data is local?

I'm making a totally local Backbone app, no server-side included, and I provide the app with some initial local data. The data is actually the Collection data which is a json file and stored in a folder called data. So I provide the Collection with a url attribute which is data/datalist.json and use this.collection.fetch() to get the inital data. All works well.
But I want any update happens in View would save changes to the corresponding Model data in this Collection json data file. It seems that this.model.save({name: newName}) doesn't work for me. Every time I refresh the whole page, the app will still show the inital data file. So how should I change the data file when a item in View is updated, deleted or created? Do I need to set a url attribute in Model?
Model.save calls the Backbone.sync method, which by default maps CRUD functions to a REST api. If you want to use something other than REST for save/update/delete, then you need to override Backbone.sync.
There is a local storage plugin that overrides sync on Github, which is endorsed by Backbonejs: Backbone.localStorage
This plugin should persist your data while the app is running. You may need to extend it if you want to write changes to your filesystem (not sure, haven't used it myself). Hopefully this gets you started.

Resources