ExtJS bind to singleton object - extjs

I am trying to bind to value in defined class, to react on it change.
But no reaction happens. I extended object from data.Model, and trying to bind via links, but something doing wrong.
class with parameter:
Ext.define('Platform.core.OssStatusAdapter', {
extend : 'Ext.data.Model',
alternateClassName : [ 'OssStatusAdapter' ],
singleton : true,
fields : [ {
name : 'ossConected',
type : 'boolean',
defaultValue : false
} ]
});
Code in some class where value is changed:
OssStatusAdapter.set('ossConected',event.connected);
code where expect reaction to binding:
Ext.define('Plugin.scheduler.package.config.PackageConfigurationViewModel', {
extend : 'Ext.app.ViewModel',
...
links: {
ossAdapter: {
type: 'Platform.core.OssStatusAdapter',
create: true
}
},
...
formulas : {
canDeploy : {
bind : {
isOssUp : '{ossAdapter.ossConected}'
},
get : function(data) {
return data.isOssUp;
}
}
}
but in formula value is not changing.
What I missed?

Try to define your formula this way:
formulas: {
canDeploy: function(get) {
var connected = get('ossAdapter.ossConected');
// see if this moves when you change the record
console.log('connected', connected);
return connected;
}
}

Related

Change dynamically class in ionic with angular-formly

i have the next code, i want change the class when the value is equal to "abc" but i can't add some class :
$scope.formFields = [
{
key: 'email',
type: 'input',
templateOptions: {
type:'email',
placeholder: 'Correo',
required:true,
class: 'some-clase'
}
}]
now, I know well then the change is done but I can not even add a simple class :
expressionProperties: {
'templateOptions.class': '"glyphicon form-control-feedback glyphicon-"'
}
help me please , if they can add an example in jsbin, codepen... thanks
Your expressionProperties property is a formly expression and can therefore be a function. It should probably be something more like this:
'templateOptions.class': function($viewValue, $modelValue, scope) {
if ($viewValue === 'abc') {
return 'some-class';
} else {
return 'some-other-class';
}
}

How to get display value of field from controller in ExtJS?

I have a component on my view:
{
xtype : 'socekiliscombo',
name : 'socekilisOid',
labelSeparator : '',
anchor : '25%',
allowBlank : false,
itemId : 'socekilis',
params : {},
listeners : {
specialkey : Ext.emptyFn
}
}
What I want to do is to get this component's display value from a controller. First I tried to get the component itself, but unable to do it. I tried this:
var socekilistarihi = this.getTalihliKayitPanel().getComponent('#socekilis');
I get a value of "undefined".
You can use standard controller refferences.
Ext.define('App.controller.Controller', {
extend: 'Ext.app.Controller',
refs: [{
ref: 'socekilis',
selector: '#socekilis'
}],
getComponentValue: function(){
var component = this.getSocekilis();
var value = null;
if(component){
value = component.getValue();
}
return value;
}
});
Hope it helps.
var socekilisCombo = this.getTalihliKayitPanel().down('socekiliscombo[name="socekilisOid"]'),
socekilisComboValue;
if (socekilisCombo)
{
socekilisComboValue = socekilisCombo.getValue();
}
And check this component really on talihliKayitPanel.

Sencha Touch Controller pushing a view

I'm trying to work out why when I push a view onto a Ext.Navigation.View control, the view I push renders, but the data I push with it doesn't. The view renders a very simple DataView control with some json data (name & surname).
It'll work if I create the view explicitly through "Ext.Create" (see commented out lines in controller), but I'm sure I've done this before where you can push "xtype" of the view and any relevant properties/data for the view. Am I right?
By the way, I've tested the json coming back from the form submission callback and everything is fine. It just seems to be the view doesn't want to render the data I send it as part of the "push". Here's my code. Am I missing something?:
View:
Ext.define('MyCo.Booking.view.PatientClinicSearchResults', {
extend : 'Ext.DataView',
xtype : 'DataViewPatientSearchResults',
itemTpl : '{Name}',
store : {
fields : ['Name'],
autoLoad : true
}
})
Controller :
Ext.define('MyCo.Booking.controller.Main', {
extend: 'Ext.app.Controller',
config: {
refs: {
navViewClinics : 'NavViewClinics',
formPanelClinicPatientSearch : 'FormPanelClinicPatientSearch'
},
control: {
'NavViewClinics list' : {
itemtap : 'ClinicUserSearch'
},
'FormPanelClinicPatientSearch button' : {
tap : 'ClinicPatientSearchResults'
}
}
},
ClinicUserSearch : function(list, index, element, record) {
this.getNavViewClinics().push({ xtype : 'FormPanelClinicPatientSearch' });
},
ClinicPatientSearchResults : function(button, e) {
var form = this.getFormPanelClinicPatientSearch();
var navClinics = this.getNavViewClinics();
form.submit({
success : function(form, result) {
// var view = Ext.create('MyCo.Booking.view.PatientClinicSearchResults', {
// title : 'Search Results',
// fullscreen: true,
// store: {
// fields: ['Name'],
// data : result.items
// },
// itemTpl: '<div>{Name}</div>'
// });
// navClinics.push(view);
navClinics.push({ xtype : "DataViewPatientSearchResults",
title : 'Test',
store : {
data : result.items
}
});
}
});
}
});
JSON received from form submission callback:
{
"success" : true,
"items" : [
{
"Name": "Jon",
"Surname": "Doe"
},
{
"Name": "Karl",
"Surname": "Doe"
}
]
}
Any help would be appreciated. Thank you.
Problem solved. I removed the store declaration from the view and it worked. Just need to reference the data via the itemTpl property.

Itemclick and itemmove in EXTJS MVC

Am having a tree panel in my view, and its corresponding controllers. What is happening is that am having two controllers, one for the itemdblclick and another for itemmove. The itemdblclick is working ok, but when i add the controller for itemmove, itemmove is working, but on the other hand, itemdbclick is not working. And if i remove the itemmove controller, itemdblclick is working. Hope am not confusing:) In simple words, the two controllers are working separately but not together.
Could anyone please tell me what am i doing wrong here.
Also, in the function editRegion in the controller, am trying to reload the tree by using the getStore.load() method, but the tree is not loading even though am able to see the store being invoked in the firebug
EDIT:
Am opening a form on double-clicking the tree node, and on closing the form, i want the tree panel to be reloaded. This is what i want to happen in editregion function
View
{
xtype : 'treepanel',
title : '',
id : 'hierarchyTree',
border : false,
alias : 'widget.hierarchyTree',
height : 1000,
viewConfig : {
enableDD : true,
plugins : {
ptype : 'treeviewdragdrop'
}
},
collapsible : false,
useArrows : true,
rootVisible : false,
store : Ext.create('App.store.HierarchyTree'),
displayField : 'Title',
multiSelect : false,
singleExpand : false,
}
Controller
refs : [{
ref : 'myHierarchyTree',
selector : '#hierarchyTree'
}
init : function() {
this.getHierarchyTreeStore().load();
'#hierarchyTree' : {
itemdblclick : this.itemdblclick
},
'#hierarchyTree' : {
itemmove : this.itemmove
}
itemdblclick : function(view, record, level) {
if (record.get('LevelID') == 1) {
this.erWin = Ext.create('App.view.EditRegions');
var f = this.getEditregionform().getForm();
f.loadRecord(record);
this.erWin.showWin();
}
else if (record.get('LevelID') == 2) {
this.eaWin = Ext.create('App.view.EditAreas');
var f = this.getEditareaform().getForm();
f.loadRecord(record);
this.eaWin.showWin();
}
itemmove : function(v, oldParent, newParent, index, eOpts) {
var nodeID = v.data.id;
var oldParent = oldParent.data.id;
var newParent = newParent.data.id;
var index = index;
var level = v.data.LevelID;
Ext.Ajax.request({
url : 'data/Locations.aspx',
params : {
mode : 'MOVENODE',
currentNode : nodeID,
oldParentNode : oldParent,
newParentNode : newParent
},
success : function() {
alert(LANG.SUC);
Ext.getStore('HierarchyTree').load();
},
failure : function() {
}
});
editRegion : function(button, record) {
var fp = button.up('form');
if (fp.getForm().isValid()) {
fp.getForm().submit({
url : 'data/Locations.aspx',
params : {
mode : 'EDITREGION',
userID : ME.UserID,
RegionID : ME.RegionID
},
success : function(response) {
alert(LANG.SUC);
this.getHierarchyTreeStore().load();
},
failure : function(response) {
alert('Try again');
}
});
}
}
adding them separately will cause the first listener object to be overridden.
Fix:
'#hierarchyTree' : {
itemdblclick : this.itemdblclick,
itemmove : this.itemmove
},
You should check if the store is the same. Meaning check the id because i think the contoller initializes one store and the panel another. so check if this.getHierarchyTreeStore().id is equal with the one from treepanel. you can navigate to it from the button something like button.up().down('treepanel').getStore().id. If they are different then you should use the second method to get the store.
tried doing the following code, as using up and down will not refer to the correct view, since the tree and the forms are completely different views
var view = Ext.widget('hierarchy');
view.down('treepanel').getStore.load();
Now, even though the store is re-loading, am geting an error
TypeError: view.down("treepanel") is null
view.down('treepanel').getStore.load();

Linked Combobox (filter store)

you need when choosing to download a combobox CountryComboBox combobox CityComboBox list of products filtered by field *city_id*. My code works, but not the first time))
Opt for the first combobox value - I go in the second - the filter does not apply. Click again on the first, again in the second - and that's only if it is applied. What am I doing wrong? And then make a filter for the output grid, as well as for the combobox?
ExtJs 3.
My Code:
tbar: [
{
xtype : 'CountryComboBox', // expansion Ext.form.ComboBox
listeners : {
'select' : {
fn : function(combo, value) {
var combobox_city = Ext.getCmp('ProductsProductTypeComboBoxForProduct');
combobox_city.enable();
combobox_city.clearValue();
combobox_city.store.filter('city_id', combo.getValue(), true);
}
}
}
},
{
xtype : 'CityComboBox', // expansion Ext.form.ComboBox
disabled : true,
listeners : {
'select' : {
fn : function(combo, value) {
this.store.filter('people_id', combo.getValue(), true);
}
}
}
},
...

Resources