How do I update a single instance in a Store? - html

I have a Store used to back a List. When I tap on a list item, I show a "details" panel. One of the buttons on the details panel initiates a POST request to initiate a server-side operation. This changes the status on the server side from "idle" to "in-progress". To update the UI on the details panel, I then load the latest data for this instance by calling load() on the Model class, e.g.
MyApp.model.Server.load(serverId,
success: function(record, operation) {
// code that updates the current view
}
});
However, this doesn't seem to update the instance in the underlying Store. So when I go back to the list, there is stale data for the server I tapped on (still says "idle").
Is there a way I can take the updated Server instance and update just that record in the Store? I don't want to have to reload my entire Store just to update the UI for one record.
I tried updating the instance in the Store, to no avail:
Ext.getStore('Server').getById(serverId).data = record.data;
Am I missing something here? Or do I really have to reload the whole Store just to get the updated status for one record?

No, you dont need reload all store and inst good update a record data manualy.
Correct:
var record = Ext.getStore('Server').first();
record.set(form.getData());
record.save();

Related

All data is gone on page reload. Is there any way to avoid that?

I have developed one dashboard application in angular js which is having search functionality and multiple views with lots of different data coming from that search functionality.
Its single page application. So I am facing issue on page reload all data is gone and it shows view with blank data.
Is there any way to solve this issue or any language which help me to create single page application and maintain same data on page reload??
Any suggestion will be appreciated.
Search Page
Data after search
Data after reload
You can use sessionStorage to set & get the data.
Step 1 :
Create a factory service that will save and return the saved session data based on the key.
app.factory('storageService', ['$rootScope', function($rootScope) {
return {
get: function(key) {
return sessionStorage.getItem(key);
},
save: function(key, data) {
sessionStorage.setItem(key, data);
}
};
}]);
Step 2 :
Inject the storageService dependency in the controller to set and get the data from the session storage.
app.controller('myCtrl',['storageService',function(storageService) {
// Save session data to storageService on successfull response from $http service.
storageService.save('key', 'value');
// Get saved session data from storageService on page reload
var sessionData = storageService.get('key');
});
You need to save data before changing the state of application / moving to another page,route.
So, either save that data using
Angular services (Save data, change route, come back check the data in service and reassign variables from service.)
Local-storage to save data. (Save data, change route, come back check the data in service and reassign variables from service.)
Rootscope. Set data in rootscope and move .. after coming back check the variables and reassign.
Your problem is not saving the data, but saving the state in your URL. As it is, you only save the "step", but no other information, so when you reload the page (refresh, or close/re-open browser, or open bookmark, or share...) you don't have all the information needed to restore the full page.
Add the relevant bits to the URL (as you have a single page app, probably in the fragment identifier). Use that information to load the data, rather than relying on other mechanisms to pass data between the "pages".
Get data on page refresh, that is something like,
$rootScope.on('onStateChangeStart', function(){
// here make a call to the source
$http(); // request and try to get data
})
use localStorage or save data to your server for users in a database temporarily and get it back with an API call(localstorage has a 10MB) limit.
You can have your code try to retrieve localstorage values first if they exist.

Reject previous route's pending action upon page transition in Redux app

I have Redux app with React Router (based on https://github.com/este/este).
Inside one Route, there may be more than 1 AJAX calls (fired by redux-promise-middleware & redux-thunk). When the page changes (via react-router) I wish to reject all remaining _SUCESS or _FAILED callback actions fired by the previous route.
What is the best way to do this?
I'd suggest that you make the data you fetch page-aware. Meaning that in the action where the fetch is started, add a page-context. When the reducer gets the data it can either save it for that page-context or it can throw it away if the location is not the same as your browser (meaning that the user has navigated away). If you keep the data for the different pages/contexts you also have the bonus of these being ready if the user returns (if that is something that you'd want).
You are on url "/pageX". You start fetching data and the action makes sure that the page-context is remembered for when the SUCCESS action is to be dispatched. When the reducer handles the action it stores the data in store.context["/pageX"].data (or similar). Note: This is where you could also throw it away (reject) in case the current location is not the same as the received data.
The UI should know how to ask/use data from the context that matches it's location only.
You might also want to consider tracking the browser-location in the state for the app...

dojo jsonrest store with periods of no internet connectivity

At the moment I don't know if this is a Dojo issue, a browser issue, or both.
I have a dojo.store.JsonRest data store of items:
//Create stores
var json = new JsonRest(options);
//Memory store
var memory = Observable(new Memory({}));
//Observable cache
var cache = new Cache(json, memory);
The store of items may be shared with different users simultaneously, so the store is periodically updated by issuing something like:
store.query({..})
When I want to add a new item to it, I use
dojo.xhr('POST',{
url:...,
postData:...,
handleAs:'json',
headers:{...},
failOk:true,
timeout:15*1000
});
This works fine. However, I would like to gracefully handle the case when the post occurs during the loss of an internet connection. In particular, I do not want the store to automatically try to post again when a connection is established again; I want the user to retry manually.
In Chrome, it appears that the POST is aborted, and regardless of an internet connection being subsequently established again, the deferred object from the POST appears to be discarded, and the new item is never added to the datastore.
In Firefox, it appears that the POST is aborted. But when the datastore is refreshed, e.g. by invoking:
store.query({...})
the new item, whose POST was aborted, is then added to the store. It's as if the query() call is quietly adding the new item to the datastore when an internet connection is established again.
I'm not observing this behavior in Chrome. And in order to get uniform behavior across different browsers, I would like to know if there is a way to ensure that once a POST is aborted, it's existence and memory is completely obliterated in Firefox.
I'm not sure why you have a separate method of adding an item to the store?
When you do a get on the Cache, if the item does not exist in the memory store, then a request is made by the JsonRest store and the returned item is stored in the memory store. There should be no need to do a separate xhr request, infact query() calls on the cache always go through the JsonRest store, you'd need to override the caches query function to make it check the memory store first. If you just want to add to the store, then a put or add would suit your needs, and do what your xhr post is doing.
Also if you are not happy with the way failed requests are handled by the JsonRest store, just extend it and override its get, query, add, remove or put function(s), handling request responses in your own way.

AngularJS form wizard save progress

I have a service in AngularJS that generates all the steps needed, the current state of each step (done, current, show, etc) and an associated directive that actually implements the service and displays the data of the service. But, there are 2 steps that are divided in 4 and 3 steps each:
Step one
Discounts
Activities
Duration
Payment Length
Step two
Identification
Personal data
Payment
How can I "save" the state of my form in case the person leaves the site and comes back later? Is it safe to use localStorage? I'm no providing support for IE6 or 7. I thought of using cookies, but that can end up being weak (or not)
Either local storage or cookies should be fine. I doubt this will be an issue, but keep in mind that both have a size limit. Also, it goes without saying that the form state will only be restored if the user returns on the same browser, and without having deleted cookies / local storage.
Another option could be to save the information server side. If the user is signed in, you can make periodic AJAX calls with the data and store the state on the server. When the user finishes all steps, you can make an AJAX call telling the server to delete any saved data it might have. This allows you to restore state even if the user returns on a different browser, as long as he is signed in.
Regardless of what direction you go with this, you can use jQuery's serialize method to serialize the form into a string and save it using your choice of storage.

Oracle APEX - HTML Links Breaks Session and Requires New Login

Ok so here is what is happening:
I have a client that I am building an application for. My client has a flowchart that they would like posted on the front page of their application. Check. My client then wants this flowchart to be set up as an image map so that a user could click one of the boxes in this flowchart and be taken to a report in another part of the application. Check.
All of that is elementary and, in a technical sense, works. The issue is, and it is an issue I have encountered before with APEX, is that every time a user clicks one of these links it takes them to the login screen. It seems that linking directly to a page's URL breaks the session and requires you to login again, even if you are linking from one page in the application to another in the same application.
I have played with all of the authentication settings in a hopes of fixing this and tried to determine what is breaking the session exactly but with no luck.
Has anyone else had this problem and could share their method for fixing it? I really cant have users logging in every time they click a link and I also cannot simply remove the authentication on the pages. Thanks in advance.
You should pass on the session id in your links. If you don't, then apex will see this as a new session. You can tell from the url: take note of the session id in your url when you are on your image map. When you select an application, take another look at the session id part in the url. If they are different, then you are starting a new session each time.
/apex/f?p=190:90:1674713700462259:::::
190 -> application id
90 -> page id
1674713700462259 -> Session id
To pass on the session, it depends where you construct your links.
In PLSQL, you can find it through :SESSION or :APP_SESSION
For example, in a plsql dynamic region: htp.p('the session id is '||:SESSION);
In javascript code you can use $v("pInstance") to retrieve the value dynamically, or use &APP_SESSION. which will have the value substituted at runtime.
Small example:
function printsome(){
var d = $("<div></div>");
d.text('&APP_SESSION. = ' + $v("pInstance"));
$("body").append(d);
};
So you probably just need to alter the construction of your link somewhat to include the session!
I was assuming the binding variables will do the job. But they were helpless.
Best way is to pass the current session id to an item then use the item value in the link.
f?p=&APP_ID.:32:&P31_SESSION.:::P32_CUSTOMER_ID:#CUSTOMER_ID#