EXTJS using the data of a grid in an other grid - extjs

I want to use the data of my grid in an other grid
when I create a window, I call a function and give it parameter, so I want that the grid in my window use this data
//In my main pag
functionThatCreatesMyWindow(villeGrid.store.data);
//In my window
myGrid.store.loadData(myParameter);
It doesn't work :(

First of all, you need to understand object scopes work in the DOM. If the store is named using a registered namespace, you can access any objects using that namespace from any JS within a document. When you have multiple windows, these will be functioning under two separate scopes.
In your scenario though there is a helper object that may be able to help you out.
Each store created on a page is automatically registered in the global, static, Ext.StoreMgr object. If the stores have storeID's (see docs for Ext.data.Store), you can use the Static StoreMgr object to reference the store in your window.
//returns reference to store object from the StoreMgr
var referenceToStore = Ext.StoreMgr.getKey('myStoreID');
If that doesn't work, create a factory method where you pass a store to the method that can consume the store.

Related

How to use containerRegistry.RegisterForNavigation with a generic ViewModel?

I have an app with two regions, one serving as a selector for data type (called NavigationPane) and the other one as a setter view for that data type (called SimulationPane). The SimulatorView.xaml I use to fill the SimulationPane has a corresponding SimulatorViewModel which dynamically creates a list of settable properties for TDataType and eventually binds it to a ItemsControl in SimulatorView.xaml. So my ViewModel needs System.Type as input:
I want to set it up as following:
public void RegisterTypes(IContainerRegistry containerRegistry)
{
containerRegistry.RegisterForNavigation<TopicSelectorView, TopicSelectorViewModel>("Selector");
containerRegistry.RegisterForNavigation<SimulatorView, SimulatorViewModel<A>>("Simulator_A");
containerRegistry.RegisterForNavigation<SimulatorView, SimulatorViewModel<B>>("Simulator_B"); // and so on..
}
Once I have it registered, I want to be able to call (from other module):
regionManager.RequestNavigate("SimulationPane", $"Simulator_{topicType.Name}");
where topicType is the data type based on user's selection (here: 'A', 'B', and so on).
The problem with this approach is that I end up with just one ViewModel, i.e. the one I registered last. My impression is that that the registration uses some kind of dictionary with view as a key.
What am I doing wrong here? How else can I achieve my goal of being able to provide a type for VM at runtime, and navigate to it?
How else can I achieve my goal of being able to provide a type for VM at runtime, and navigate to it?
Register multiple viewmodels with the same view is not supported in Prism. See #brianlagunas answer on GitHub:
As I said in my reply to your PR, this is not something we will support in Prism. You have a few options, two of which we have already discussed; create a unique view, or have a single VM and load the relevant data.
Why do you need to pass A and B as generic parameters?
I'd have a single SimulatorViewModel and inject a service from which the view model can get the list of parameters to be set by the user. This could be done through reflection (on the simulator type) or a list of parameter descriptors (IReadOnlyCollection<Parameter> ISimulator.Parameters { get; }), whatever you prefer.
When changing the simulator type, you update it in the service and the SimulatorViewModel updates its list of parameters, because it listens to the service's INotifyPropertyChanged.PropertyChanged.

ng-repeat convert resource objects to simple objects

Iam getting my data with help of the Angular's $resource service as array. Each element of that array is an Resource-Object. So i can use methods like $save and $update of these Objects. In a view i represent my array with the help of the ng-repeat directive like:
<div ng-repeat="appointment in object.appointments" ng-click="editAppointment(appointment)">
And here i get in trouble. The appointment-Object i get in the editAppointment-Method is a simple Object. No Resource Object anymore. So i cant use the helpfull methods like i mentioned above.
$scope.editAppointment= function(appointment){
console.log(appointment); // > Object
console.log(object.appointments); // > Array of Resource
}
Have somebody noticed that problem too? May its a bug, but i cant imagine that.
Assuming your resource class is called Appointment, you should just be able to do:
$scope.editAppointment= function(appointment){
new Appointment(appointment).save();
}
Presumably your Appointment resource looks something like the following (i.e. it correctly maps some sort of id property from existing objects to the URL parameters):
var Appointment = $resource('/appointment/:appointmentId', {appointmentId:'#id'});
This would be the case if your appointment objects (i.e. the underlying JSON objects handled by your API) have an ID property called id. If it's called something else (or if there are multiple path variables in your URL) you'll just need to change the second argument to map all of the properties of the objects being saved (the values starting with '#') to the URL path variables (the things starting with ':' in your URL).
See where they save a new card in the credit card example here: http://docs.angularjs.org/api/ngResource.$resource. The fact that they're dealing with a totally new object and that you're trying to save an existing one is irrelevant. Angular doesn't know the difference.

Why using the this.$(selector).method() syntax with backbone?

I have seen this bunch of code in a tutorial:
var searchTerm = this.$('#searchTerm').val().trim();
I would like to understand the utility of the this. in front of the selector, it's the first time i see that.
In a Backbone.View, this.$ gives a scoped version of jQuery. It is in fact equivalent to using this.$el.find which is in turn equivalent to using $(this.el).find.
Anyhow, the reason it is a good idea to use it is that it will only access html elements from within the view's element/rendered template. Thus, you don't have to worry about the rest of the html page and you will always select the element you expect to.
Imagine that you have a view that spawns sub-views and that each of these have an editable field. If you don't use the scoped version of jQuery to get the right editable field, you will have to give a unique id to each of these html elements to make sure you will select the right one when retrieving it's content. On the other hand, if you use the scoped version, you will just have to give this editable field a class attribute and selecting this class will give you a unique element, the right one.
This is the same query as this.$el.find('#searchTerm').val().trim();
You haven't given any context to that code, but assuming it's a method inside a View, this refers to the View object.
this.$ is a shortcut to access jQuery from the View object, and is equivalent to the method this.$el.find.

Call a function on fragment load

I have a fragment with a table.
the value of this table comes from a list in the bean.
I need to fill the list when the fragment is loaded.
I was trying to do that as I saw here:
https://kr.forums.oracle.com/forums/thread.jspa?threadID=2386966
but I see that it's filling the list on load and then the constructor of the bean is called again,
so the list get a new instance and in fact its empty again.
Do you know why it happens?
Or is there any other way to fill a list in the bean when the fragment is loaded?
Thanks!
You need to change the scope of your bean.
I suggest trying the 'view scope' first.
You can have the default entry point to your taskflow be a method call that initialize a list in a pageflowscope managed bean. Then you should be able to refer to that list in all the pages in your flow.

Ext JS ComboBox Dynamic Behaviour

I am trying to load/show completely different set of values in a combobox(this one resides as a editor within an EditorGridPanel) based on the valueField of another combobox(this one resides outside the grid in top bar). I have already seen a tutorial(http://www.extjs.com/learn/Tutorial%3ALinked%5FCombos%5FTutorial%5Ffor%5FExt%5F2) wherein ALL the values for the secondary object are stored locally and then filtered however, I have already created a link which will supply me with json data based on the valuefield, so I would like to use this url to keep the code efficient.
I have also tried to refresh the datastore but its simply not being reflected on the combobox.
Please advise
Thanks
Found the solution, loading values from a url is straightforward.. if you want to manipulate the query(like I wanted), you would have to strip url off the dynamic parameters and assign them to baseParams of the store and then call store.load()
It worked for me!!

Resources