Passing arguments to a window in ExtJs 6? - extjs

I would like to a pass a record from a grid to a window that I create,
Ext.create('MyWindow',
{recordRef: record}).show();
where record is an argument that is passed into my rowdblclick function but when I try to access recordRef (like below) during debugging, it is undefined.
var me = this;
var record = me.getView().recordRef;
The code fragment above is in a controller for MyWindow.js

The reason this is happening is probably because you are using an event to access recordRef that is called before the constructor assigns recordRef to your window as a property.
My advice would be to use the show event just to be sure, here is a fiddle: https://fiddle.sencha.com/#view/editor&fiddle/232m

You can access custom configs you add to a component with getConfig - in this case it would be this.getConfig('recordRef')
Here's a small fiddle where the custom config is logged to the console, and set to be the window's title.

Related

How do I return focus to an element when the entire page changes?

I have a complicated setup. My application is driven by a set of "rules" which dictate what the user interface is. The UI is rendered by looping through the rules and creating the individual dropdowns. Initially, everything renders properly. However, once a user makes a change to the UI, other rules may be affected. In my application, an api call is made, which then returns a modified set of rules. In the attached plunker, I've simplified things such that only the new set of rules is applied, which causes the page to re-render. The problem is that my users would like to be able to tab between all of the entries on the page and make changes. However, once the page is re-rendered, the currently selected page element is now gone nothing has the focus. I've tried to put the focus back on the proper element by tracking a common Id, but to no avail.
Using either of these doesn't seem to work.
var el = document.getElementById(focusId);
el.focus();
angular.element(el).focus();
I've also tried using the autofocus attribute on the dropdown that I want to have focus, but that didn't work either. I'm using angularjs 1.2. Any ideas are appreciated.
http://plnkr.co/edit/ND9PKqULIOlixWR4XChN?p=preview
If you want to assign auto focus dynamically to a element on the DOM from angular you can use this:
var myEl = angular.element(document.querySelector('select'));
myEl.attr('autofocus',"attr val");
You can also pass in an id like: angular.element(document.querySelector('#focusId'));
You can look here for a prior answer which may be of some more help!
-Cheers!
Problem here is, you are trying to focus the element before the blur event completes. So you need to execute the focus code after blur event. Async execution of your focus code would solve the problem. You can use either setTimeout or $timeout.
setTimeout(function(){
angular.element('#'+focusId).focus();
/* //or
var el = document.getElementById(focusId);
el.focus();
*/
});
or
$timeout(function(){
angular.element('#'+focusId).focus();
/* //or
var el = document.getElementById(focusId);
el.focus();
*/
});
dont forgot to inject $timeout to your controller if you are using second code. Hope this helps :)

Dynamically Populate Drop Down List inside Multifield in AEM

I have two tabs in my dialog.First Tab is having a pathfield and second tab is having a multifield inside that only one widget of xtype selection(drop down) exist.I want to send the pathfield path as a query parameter to a servlet and want to populate json in the list.
I have done this by having a listener under drop-down widget.
i am using property render and its value:
function(){
var dialog = this.findParentByType('dialog');
var path=dialog.findById('path');
$.getJSON('/bin/demo?path=' + path.value,
function(jsonData){
this.setOptions(jsonData);
this.doLayout(false,false);
}
);
}
My JSON response is coming but setOptions is not a function error is coming.
Please Help!!!!
this value depends upon the context where you are making use of this.
I believe that is the problem here. this value would differ inside and outside the $.getJSON. You would need to bind the value of this object for the function.
The link has given the example also. Either you need to store reference of this to a variable or bind this reference using the bind method. Refer this for more details

How to access helpers in controller and why is my find() empty?

I'm pretty new to the new meteor 1.3.1. So I've never worked with helpers before.
This is my helper:
this.helpers({
questions() {
return Questions.find({categoryId: this.categoryId});
}
});
First question: How do I access this helper (questions) within it's own controller? I tried $scope.questions, this.questions and this.play.questions (play is the alias of the controller). Everything is undefined.
In my view I iterate with ng-repeat='question in play.questions' and it works fine.
Then I thought maybe helpers can't be accessed in the controller. So I tried this:
this.questions = Questions.find({categoryId: this.categoryId});
But here the problem is that I get an empty cursor. Any idea why that is?
I assume you are in your controller function and you have used
$reactive(this).attach($scope)
before you do
this.questions = Questions.find({category: this.categoryId});
? One reason your cursor is empty when not using a helper might be that your subscription is not ready by the time you set this.questions. Therefore you should make this assignment reactive by wrapping it inside a this.autorun. By doing this the cursor gets updated as soon as your client side collection is populated.
I think instead of calling your helper from within your controller you should extract a common function and use it inside the helper and whereever else you need it. The helpers are really only used to get data to the UI if I am not mistaken (<- ?).

ng-table , getData called more than once, why?

For some reason when getData uses angular resource to bring the data it is being called twice, causing the resource to do it REST request twice too <--- bad...
Any idea why and how to solve it?
Here a working testcase/plunker example that recreates this scenario (look at the browser console - "getData being called...." displayed twice ) b.t.w as you can see I'm not really using the resource to bring real data, just to demonstrate the scenario, In my real app I do use the resource to bring real data and its being called twice just like in this example,
Thanks ahead
After looking into the src of the ng-table I noticed the following
$scope.$watch('params.$params', function(params) {
$scope.params.settings().$scope = $scope;
$scope.params.reload();
}, true);
Which means that the tables calls it 'getData' on count/filter/group/groupBy/page/sorting
which explains the behavior I was seeing.
When you call params.count(...) you ask ng-table to refresh data as you change page size. That's why you have two get-data calls.
If you don't want to have paging, then remove calls params.count and params.total.
If you need paging, then set page size and do not change it in getData.
This happened to me with a weird reason. getData get called twice on init (first load) only. changing page or sorting didn't call getData twice. The reason was that at init the ng-table directive was hidden in the template file.
Thank #Alexander Vasilyev. I understood my problem as you said. I want to explain a litte more here. In fact, the object "params" is the object configuration the table ng-table, then if "params" changed (ex: count or a property of the object), ng-table will invoke function getData() to refresh table.
In my case, I want to get information in the object "params" and change it but I dont want to refresh ng-table. I did it by cloning object "params" et work his object copied. Clone the object in JS with jQuery :
var resultParams = jQuery.extend(true, {}, params.$params);
And then, I will work on the object resultParams instead of "params" original.

this.getJobStore is not a function - extjs

1) I have a store called "Job". Is correct that method "getJobStore" is automatically created.
2) in the following code example. I get this error. "this.getJobStore is not a function". When i go console.info(this) i do not see this function. So what property should be "this" ?
onSubmitBtnClick: function () {
var form = Ext.getCmp('formJobSummary');
var record = form.getRecord();
var values = form.getValues();
this.getJobStore().sync();
},
Make sure that you have set the scope properly for your onSubmitBtnClick listener. My guess is that it is running in the scope of your button, not your controller (that is, you haven't specified scope: this in your listener configuration). If you post the configuration of the controller entirely, we would be able to say for sure.
this should be a controller object which is listening the events of this button (as example).
Is that true for you now?

Resources