PDA

View Full Version : check the json data for comparing in extjs



venkateshwar
13 Feb 2013, 3:16 AM
I created a simple login page using extjs MVC to understand MVC architecture of extjs. As you can see below, I am trying to get the json data into the store and then I will check each username and password in that data with the entered login credentials. The thing in which I am confused right now is that, how to check the username and password from the retrieved json data present in store folder into the controller folder? (Below code is only the related code with the problem)
I am aware of that this could invoke security threats, as I am checking on client side.

'store' folder --> Code.js (I am not sure whether this code is storing the json data or not, given json address is correct)


Ext.define('LoginPage.store.Code', { extend: 'Ext.data.Store',
model: 'LoginPage.model.Code',
autoLoad: true,



proxy: {
type: 'ajax',
api: {
read: 'data/loginResponse.json',
update: 'data/checkCredentials.json' //Contains: {"success": true}
},
reader: {
type: 'json',
root: 'loginResponse',
successProperty: 'success'
}
}
});




'controller' folder --> Code.js (How to declare the variable for store folder's Code.js ? so that I can user here to check the credentials.)



Ext.define('LoginPage.controller.Code',{ extend: 'Ext.app.Controller',
views: ['Code'],
store: 'Code',
init: function() {

this.control({
'#btnLogin': {
//setting edit operation on double click.
click: this.checkJson("venkat","123")
}
});
},

checkJson: function(username, password){
var store = Ext.create('LoginPage.store.Code');
//var store = this.getStore();
//var store = this.getCodeStore();
console.log(store.data);
var matched = store.query('username', username);
if(matched.length && matched[0].get('password') === password) {
//matched
}
else{
//didn't match
}
}

});

loginResponse.json


{ "form": {
"login": [
{
"username": "venkat",
"password": "123"
},
{
"username": "admin",
"password": "345"
}
]
}

}

Here I am trying to create a variable of the 'store' folder, Code.js file in 'controller' folder, Code.js file. So that I can compare the username and passwords with the user entered credentials. The following are my tries and their errors:



I tried var store = this.getCodeStore();, I am getting error --> Uncaught TypeError: Object [object Object] has no method 'getCodeStore' . (The store is extended to Ext.data.Store.)

I even tried var store = this.getStore() which is showing error --> Uncaught TypeError: Cannot call method 'indexOf' of undefined

Atlast, I tried var store = Ext.create('LoginPage.store.Code'); which is showing 0 items when I checked in Chrome console. Is my 'store' folder Code.js file is ok? or I am declaring the variable wrong.

mitchellsimoens
14 Feb 2013, 9:17 PM
What is the scope of where you are calling this.getCodeStore()?

Also looks like your store's reader's root config is not correct based on the JSON file you provided.

venkateshwar
14 Feb 2013, 9:22 PM
Thanks for your response. I solved this. There were two errors. The first one is in controller, the reference of store should be stores not store and the second mistake was I was calling var store = Ext.getCodeStore(); instead of var store = Ext.getStore('Code');. But I am still confused where to call stores and where to call store??