load store which loads all grids automatically - javascript

Lets say I have two(or more) same panels with same store in my app and they are on the screen. I changed something in one panel and want to refresh two stores at the same time. ok I know how to access with Ext.cmp() or up() or down() function but is it possible to just load store and refresh it everywhere? or how to do this? any example...

It should happen automatically. The framework has one-way binding build into it out-of-the-box. You can test this by open a page with a grid and a loaded store. If you then go to your console and get the store and add a item, it will automatically be added to the grid or edit the record bind to the model on the store. Type in the console of your devtools of your browser something like this:
Ext.getStore('Users').add({id: 9238,firstName:'Goga',lastName:'Gubi'});
or
Ext.getStore('Users').getAt(2).set('firstName', 'Goga');
The fields and the store should correspond with your store and model off course.
As soon as your store is updated it will "rebind" the views to which the store is binded. This is why you always should use loadRecord on a form or get a reference to a store bind to a grid and use add() to add a record.

Related

Changing refresh button handler of Extjs GridPanel top-bar paging tool

I am trying to change the Refresh button handler of the Extjs GridPanel top-bar paging tool.
PREFACE:
I have created two stores for a single grid panel. One remote store fetches records from the DB and then after that loads the data onto the other local store. The reason is that I want local pagination with a lot of data.
PROBLEM:
Since the local store has no proxy on clicking the reload button in the grid's top-bar paging tool nothing happens. I need to overload/change the handler of that button to call the remote store to reload.
MORE PROBLEM:
I have only the extjs grid panel object on hand. Can't change the definition/code of the Ext.create('grid-panel',{}). Only have access to the output/grid object.
the button is visible through this command but can't change any of its properties.
***.***.****.***.****.gridObject.getDockedComponent('toptoolbar').getPagingItems()[10].items
*** is the namespace of the object(cant share that)
QUESTION:
Is there any way to tackle this problem or I am doomed?

ExtJS 4.2 How can I get all the stores of a view?

I´m trying to obtain all the stores of a view in a controller. For example my view is a panel that has 2 grids and 4 combos,every one has his own store.
Is there a way to obtain all the stores using Ext.ComponentQuery or something like this.Ext.StoreManager returns all the stores of the app,I only want the stores of a specific view.
If you have a component that does have a store that is not bound using the store property, bad luck. But if you are only working with basic ExtJS components like grid and combo, you may try whether
view.query("[store]").map(function(cmp) {return cmp.getStore() });
does what you want...

Refreshing Angular view after changing a value

Because the page I am working on is a legacy page with lots of dead/living/zombie code I am unable to paste it whole here. So I am trying to post a digest of my issue with sample code.
I have a page in which data comes from Angular. It is a bunch of products. Each product has an attribute named showProduct that determines it should be shown or not. The showProduct attribute is set to 1 when it is first fetched from the backend. While rendering the html, in each product div I have
ng-show={{product.showProduct}}. The ng-show works correctly the first time when its loaded, all products are shown. If from the backend I set this to 0 for any product, it is hidden.
Once the products are loaded, if the user clicks a button, I need to hide some of those products. This button click handler is in jQuery.
So I do the following:
prod = angular.element($('#product-section')).scope().ProductList;
prod is now an array of products with their attributes. Now I iterate through this array, check for the attribute in question (which I know based on what button was clicked) and based on its value for each product, I set a showProduct attribute to 0.
However this does not update the view, to hide that product. If I console.log the angular.element($('#product-section')).scope().ProductList, I can see that its showProduct has correctly been update from 1 to 0.
I am assuming that there is something I need to do in order to make the productList be "re-parsed" and refreshed in the page. However I am not sure how to do this.
I just needed some conceptual tips on what I might be missing, because I understand that providing "specific" code tip for my situation is difficult.
In a nutshell, once I have updated the angular value externally, how do I tell Angular to reparse the code and refresh the view? Something like how it happens automatically for models when updating data in a textbox...
I tried doing angular.element($('#product-section')).scope().$apply(); but that did not work.
Any pointers are greatly appreciated.
Try this:
$scope.$apply(function() {
angular.element($('#product-section')).scope().ProductList;
});
By doing this, you're telling AngularJS to watch what your enclosed code is doing and update the view accordingly.
Just some consideration: wouldn't you be able to just update the model directly instead of invoking an external code? This approach is always recommended.
Angular uses two way data binding, which works, when you use an Angular-Controller (or Directive, etc), in which you define your model. In your HTTML you use something like this (very crude example):
<div ng-controller="myProductListController>"
<div ng-repeat="(index, product) in productList">
<div>{{ product.name }}</div>
</div>
</div>
productListis in your myProductListController and is available in the scope (your model) of your ng-controller directive.
Now, each time the productList changes in your controller, your view will update automatically.
Scopes (models) are bound to some Angular-Controller (or Directive, ...). So you need to have that, in order to use two-way-binding here.
Hope that helps

Apex - Clear form when leaving page (also on redirect)

Currently, if I populate a form and leave the page, the form entries will still be present when I return to the form. Is it possible to prevent these entries from being saved?
The items' default values are populated using PS/SQL, but the content can be adjusted.
I tried creating a dynamic action to clear the items on 'Page Unload', but this didn't do anything. Is this the correct browser event, or did I simply get the implementation wrong?
Update: To provide a bit of context...
Pages:
Home
Form
DML Form (insert) - I want any modifications to not be stored
Page 3 can be accessed via Page 1 or Page 2.
If the user accesses the form via Page 2 (a different form), they will have selected a specific value and this is used to populate default values on Page 3 (via item and PL/SQL Function Body).
If the user accesses the form via Page 1, the same PL/SQL will run - this may result in Page 3 form items being empty (NULL default values).
HOWEVER, when the user edits Page 3 items (changing from default values), these values will persist when the user next accesses the form. How can I prevent this state from being captured?
You will need to clear the cache of the page. This will clear the session state of the items on the page and thus result in items being empty once again.
You may need to add this clear on several locations. If you have used column links to access the page, buttons with redirects, branches, etc. The apex URL has a part which states which pages have to be cleared, and you can generally define this clearing of a page cache declaratively.
You can also create processes where you can define which page (or pages) has to be cleared. For example, if you always want the cache to be cleared when entering the page, no matter where you came from, you could add a process on the page doing just that.
Session state is ultimately what is causing this behavior: go to the page, change some things, page gets submitted for whatever reason and causes session state to be saved.
Usually, on DML forms generated through the wizard, the cache would only be cleared when using the "create" button coming from another location (usually the overlying report).
Here is the (apex 5.0) documentation on session state and managing it.
You can do it with something like this, but first you need to add jQuery to your page. I recommend using a content delivery network (CDN). You can edit the code to clear the value in your type of forms. I hope this could help you!
jQuery CDN example
$(document).ready(function() {
$("body")
.find("input").val("")
.end()
.find("select").val("-")
.end()
.find("textarea").val("");
};
});

ember-data and how to trigger commit when all bindings and observers have updated?

I have a Item model that has many Sections. Each Item is stored in mongodb and the sections are embedded documents, so when I get an item the json contains the sections.
When I change a property in a section, a number of other sections can also change as they are bound to that property.
How do I save this change to the server after all bindings and observers have been completed ?
I don't really want my users to have to click a save button but I also don't want to save after each change as I will be saving after the change and also after the bound sections changes as well!
Hope this makes sense.
If anyone can show me an example of how to do this it would be great!
Since you are using ember-data, you can create a transaction for that. Once you have made all the changes on the trasaction, then, just call transaction.commit() to bulk update your changes.

Categories

Resources