I have been trying to access global value inside one controller, but could not access it. i have been following this How to define global variable in sencha but could not set and access global values.
in Controller
config: {
successMessage:100,
control: {
'submitnewword': {
activate: 'onActivate',
itemtap: 'onItemTap',
ConfirmTestCommand:'Confirm'
},
.......
},
onSearchKeyUp: function(searchField) {
success: function (response) {
this.setSuccessMessage(1);
}
else {
this.setSuccessMessage(0);
}
}
and access it
Confirm: function () {
console.log("Confirm----- Caling on Controller");
var testing=this.getSuccessMessage();
console.log("Confirm----- value--"+testing);
},
I dont know, what is the wrong with my code.
I am getting this on console:
Uncaught TypeError: Object [object global] has no method
'setSuccessMessage'
The problem is about scope and you can solve it by:
In your controller init method
init : function() {
me = this;
}
Now access the methods using
me.setSuccessMessage(1)
me.getSuccessMessage();
I think you ran onto the scope visibility issue... I'm not sure where an exception is emitted, from onSearchKeyUp() or from Confirm(). But guess inside it this points not to the controller instance. To help you more you need share more info (sources)
The success function inside onSearchKeyUp has a different scope when it is called. So, inside it, this is not your controller where the successMessage (and of course, its getter and setter) is defined.
A solution is to "bind" the success function to the controller scope using:
success: Ext.bind(function (response) {
this.setSuccessMessage(1);
}, this);
Related
I am new to backbone and sugarcrm. Can anyone please explain how to use the value returned by one function in another function?
This is the pseudo code :
({
extendsFrom: 'RecordView',
initialize: function(options) {
this._super('initialize', [options]);
this.context.on('button:get_tax:click', this.get_tax, this);
this.model.addValidationTask('addressValidation',_.bind(this.save_button, this));
},
save_button: function(fields, errors, callback) {
use the value of 'currentTax' variable
},
get_tax: function() {
var currentTax = this.model.get('taxrate_name');
return currentTax;
}
})
Thank you
save_button: function(fields, errors, callback) {
var curTax = this.get_tax();
},
Explanation:
get_tax is a function that you have defined within the ({...}) object.
Backbone calls the initialize function with that object being accessible via this.
By using _.bind(this.save_button, this) (in initialize) you are binding the this object to the save_button function, meaning that it will also be available as this within your function when called.
Therefore you can access the same object with this in that function and just call the object's function and retrieve the value.
How I can pass object from page to page with $stateProvider in angularjs? Can you give me some code snippet? I'm new in angular
Thanks in advance
When defining a state you have a few options:
.state('my-state', {
url: '/my-state',
templateUrl: 'my-state-url',
params: {
myProperty: 'some value',
}
})
Then you can do this while changing state:
$state.go('my-state', {myProperty: 'new value'});
In the state controller you can access the myProperty like so:
$scope.myProperty = $stateParams.myProperty;
But depending on the data you want to pass, a custom angular service can/should be used. There's a good tutorial regarding this subject here.
You don't pass the object, you pass the object's ID which will allow you to retrieve the object.
You should use ui-router for this.
When definining states you will define the URL as something like ...
"url": '/an/example/path/:objectid',
"controller": "YourControllerForThisView",
USE OF THE COLON DEFINES THAT THIS IS A VARIABLE PARAMETER
Then in your controller you can access
state.params.objectid
Then in your controller you will call a method like ...
myService.getObjectFromList(state.params.objectid)
OR
myService.getObjectFromHttpCall(state.params.objectid)
to populate the object to be used when rendering the view
Hope this helps
If you're looking to "pass" objects only between a few (e.g., two or three) views, then using $stateProvider would suffice. However, if the same objects shall be retrieved/modified by several different parts of the application, it would be better to place these objects in a service.
For instance, a factory may be created to store such an object.
(function () {
angular.module('myApp').
factory('myFactory', myFactory);
function myFactory() {
var object ={};
var service = {
getObject: getObject,
setObject: setObject,
setObjectProperty: setObjectProperty
};
return service;
function getObject() {
return object
}
function setObject(newObject) {
//Some modification logic here
object = newObject;
return object;
}
function setObjectProperty(property, value) {
//Modify/assign new object property here
return object;
}
}
})();
A controller can then use the factory to retrieve/modify the stored object.
(function () {
angular.module('myApp').
controller('MyController', MyController);
function MyController(myFactory) {
var vm = this,
someObject = { ... };
//Invoke public factory functions
vm.object = myFactory.setObject(someObject);
}
})();
I solved issue, the problem was in version of angular-ui-router, it jsut didn't work with version that I had, to be more concrete I got error when I try to add params on state
UPDATE 2:
I found out where the problem was coming from and I left out the important part.
I'm setting the property in the first controller INSIDE this
$rootScope.$on('anEvent', function (event, data) {
InjectedService.setToken(data.value);
})
But I can't grab it from outside that callback scope. The event that is listened for depends on an $http request so I'm guessing that is the problem. Are there any workarounds to this?
UPDATE:
The order of controllers are the other way around so that the code in secondController is actually being called first in my actual app. I have reordered them accordingly
Question:
I'm trying to grab the services specific property but when I try to grab the service property, I get undefined (using a getter function or not). But when I try to grab the full service, I get everything with the correct property and value.
main.js
angular.module('myApp', ['myModule', 'myServices'])
.controller('firstController', ['InjectedService', function(InjectedService) {
InjectedService.setProperty('Hello World')
}])
othermodule.js:
angular.module('myModule', [])
.controller('secondController', ['InjectedService',
function (InjectedService) {
console.log(InjectedService); // Full object with property == 'hello world'
console.log(InjectedService.property); // I get undefined
console.log(InjectedService.getProperty()); // I get undefined
// interesting to note:
InjectedService.setToken('A different string');
console.log(InjectedService.property); // I get 'A different string'
console.log(InjectedService); // Full object with property == 'Hello World' which was set in second controller
}])
services.js:
angular.module('myServices', function
.service('InjectedService', function(){
var Service = this;
Service.setProperty = function (value) {
Service.property = value;
}
Service.getProperty = function () {
return Service.property;
}
Service.unsetProperty = function () {
Service.property = null;
}
return Service;
})
It seems to me a scope problem, but the variable isn't a primitive type. Any suggestions?
I am having a strange error with angular.js I am using version 1.2.26. Below is my code, I am not able to access properties I set in $rootScope. When I log $rootScope I can see those properties. But I am not able to access the properties.
angular
.module('ids.factories', [])
.factory('StoreFactory', ['$rootScope', function ($rootScope) {
console.log($rootScope);//This is defined and i can see the store property
console.log($rootScope.store);//This seems to be undefined
return {
get: function (key, callback) {
return $rootScope.store.get(key, callback)
},
save: function (key, data, callback) {
$rootScope.store.save({
key: key,
value: data
}, callback);
},
remove: function (key) {
$rootScope.store.remove({key: key});
}
}
}]);
This error depends on how the developer tools of your Browser are working. Like tasseKATT said in his сomment, the console.log() got called before the Variable is initialized. Later in the Console, you see only a reference with the evaluated code. The Developer - Tool gives you a hint by a small blue Sign besides the console.log entry. (you see it in your screenshot, too)
Greetings!
I am working in extjs4.I am getting stuck at a point where I want to load controller dynamically in extjs4.I am using controllers this.getController() method to load controller dynamically.
*When I am placing this code in init() function of particular controller then it works and controller get loaded dynamically.*Here is my controller code...
Ext.define('B.UserController',{
----
init:function()
{
var controller = this.getController('kp.PollController');
controller.init(); // launch init() method
this.control(
{
'KpLogin button[action=loginAction]':
{
click:this.authenticateUser
},
});
},
-----
But when I am placing my code in particular function(buttons event) then it gives me error.
Here is my code...
Ext.define('B.UserController',{
-------
init:function()
{
this.control(
{
'KpLogin button[action=loginAction]':
{
click:this.authenticateUser
},
});
},
authenticateUser:function(button)
{
var controller = this.getController('kp.PollController');
controller.init(); // launch init() method
}
-----
After placing this code in then I got error in firebug...
Uncaught TypeError: Cannot read property 'readyState' of undefined Connection.js:818
Ext.define.onStateChange Connection.js:818
(anonymous function)
Here is my app.js code....
Ext.application({
name:'B',
autoCreateViewport:true,
controllers:['sn.UserController','qb.QbquestionController','kp.DnycontentController',/*'kp.PollController','kp.PolloptionController',*/'kp.KpquotationController','qb.QbqnsController','kp.CuriosityquestionController','kp.WordController','kp.DnycontentcategoriesController'],
launch:function()
{
console.log('Application launch');
},//End of launch function
});
I dont know whats going wrong.Please give me some suggestions....
You can put below code in the authenticateUser function
authenticateUser:function(button) {
var app = this.getApplication(),
controller = Ext.create('kp.PollController', {
application: app
});
app.getControllerInstances()['kp.PollController'] = controller;
controller.init();
}
Are you sure that controller hasn't been loaded yet? Because when you're in the init function of controller X you can't know for sure if controller Y has loaded and it won't throw an error on the init() call of that controller.
I think you'll need to check wether your controller hasn't loaded yet:
if (!this.application.controllers.get(controllerName)) {
var controller = this.getController(controllerName);
controller.init();
}
Because if the init already has been executed it won't work and throw an exception like you pointed out.
Whats in the controllers array of your Ext.application()?
I have done this by using the getController of the Application, and it worked just fine.
You have to add the application to your global variables by setting 'addProperty' on the application's definition. Here is exactly how
And then call the controller like this:
MyApp.Current.getController('UserController');
Could it be that the scope is wrong? I believe than in the first case this is the controller. In the latter, this is the button.
Either set me = this in init and refer to me
or enclose the event handler in a function like this:
'KpLogin button[action=loginAction]':
{
click: function() {
this.authenticateUser();
}
Make sure you pass the arguments if you also need to handle the event.
I think there's also a third way by setting specifically the scope: this for that listener.
'KpLogin button[action=loginAction]':
{
click: authenticateUser,
scope: this
}
Ext.application({
launch: function() {
_myAppGlobal = this;
}
});
var controller = _myAppGlobal.getController('kp.PollController');