Reading json values after loading to a store - extjs4

I am trying to read the values from json which is returned from the db. But I am unable to do that. Its giving undefined.
In Firebug its giving the correct values in the following format
{ "COLUMNS":["B","C","D","E","F","G"],
"DATA":[[1.253,0.54,2.54,8.245,0,0.253]]
}
When I give console.log(response[0].DATA.B), its giving undefined.
I tried alert(response[0].get('B')); This is also giving undefined.
alert(success) is giving true.
Can someone please tell me what is going wrong here.
Thanks in advance..
Here is the code I am using
Ext.define('DBRec', {
extend: 'Ext.data.Model',
fields: [
{name:'A', type :'string'},
{name:'B', type:'string'},
{name:'C', type:'string'},
{name:'D', type:'string'},
{name:'E', type:'string'},
{name:'F', type:'string'},
{name:'G', type:'string'}
]
});
var DBRecStore=Ext.create('Ext.data.Store', {
model: 'DBRec',
proxy: {
type: 'ajax',
url : 'dbFunctions.cfc?method=getRec',
reader: {
type:'json',
root:'DATA',
fields: ['B', 'C', 'D', 'E', 'F', 'G']
}
}
});
function loadLimits()
{
DBRecStore.load({
params: {
reader: 'json',
returnFormat: 'JSON'
},
callback: function(response, options, success){
alert(DBRecStore.getCount());
if (DBRecStore.getCount() == '0') {
alert("no records found");
}
else
{
alert("records found");
console.log(response[0].DATA.B+" "+response[0].DATA.C);
}
}
});
}

If you not using your own reader, as i see you don't, then your data array must be a objects array, not array of arrays.
{ "DATA":[{a:1.253,b: 0.54,c: 2.54,d:8.245,e:0,0.253}] }
And you don't need to define field in store, it's already in model.

Related

jsfiddle throws an error while validating the form

My form isn´t validated I don´t know why. I tried js fiddle and now there is an error:
{"error": "Shell form does not validate{'html_initial_name': u'initial-js_lib', 'form': <mooshell.forms.ShellForm object at 0xa9dfd8c>, 'html_name': 'js_lib', 'html_initial_id': u'initial-id_js_lib', 'label': u'Js lib', 'field': <django.forms.models.ModelChoiceField object at 0xa77d52c>, 'help_text': '', 'name': 'js_lib'}{'html_initial_name': u'initial-js_wrap', 'form': <mooshell.forms.ShellForm object at 0xa9dfd8c>, 'html_name': 'js_wrap', 'html_initial_id': u'initial-id_js_wrap', 'label': u'Js wrap', 'field': <django.forms.fields.TypedChoiceField object at 0xa92e7cc>, 'help_text': '', 'name': 'js_wrap'}"}
http://jsfiddle.net/JeffersonSampaul/GSY83/2/
can anybody tell what mistake I am doing here???
Your fiddle doesn't use the jQuery library nor the jquery.validation external library.
Here's a fixed jsFiddle Demo.
The code is the untouched.
jQuery.validator.addMethod("notEqual",
function (value, element, param) {
return this.optional(element) || value !== param;
},
"Please specify a different (non-default) value");
$("#research").validate({
rules: {
address: {
notEqual: "ADDRESS"
},
building: {
notEqual: "BUILDING"
}
},
submitHandler: function () {
$("#research").submit();
}
});

Not storing value on localstorage in sencha

I am trying to store data offline aspect, but here i want to store data on localstorage, did not store able to store this, all value getting null in localstorage.
This the based on ; http://www.robertkehoe.com/2012/11/sencha-touch-2-localstorage-example/
Models:
*Online.js*
Ext.define('default.model.Online', {
extend: 'Ext.data.Model',
config: {
fields: [
'cat_id',
'category_name'
]
}
});
Offline.js
Ext.define('default.model.Offline', {
extend: 'Ext.data.Model',
config: {
fields: [
'cat_id',
'category_name'
],
identifier:'uuid', // IMPORTANT, needed to avoid console warnings!
proxy: {
type: 'localstorage',
id : 'category'
}
}
});
Stores:
Ext.define('default.store.News', {
extend:'Ext.data.Store',
config:{
model:'default.model.Online',
proxy: {
timeout: 3000, // How long to wait before going into "Offline" mode, in milliseconds.
type: 'ajax',
url: 'http://alucio.com.np/trunk/dev/sillydic/admin/api/word/categories/SDSILLYTOKEN/650773253e7f157a93c53d47a866204dedc7c363?_dc=1376475408437&page=1&start=0&limit=25' , // Sample URL that simulates offline mode. Example.org does not allow cross-domain requests so this will always fail
reader: {
type: "json",
rootProperty: "data"
}
},
autoLoad: true
}
});
Controller:
Ext.define('default.controller.Core', {
extend : 'Ext.app.Controller',
config : {
refs : {
newsList : '#newsList'
}
},
init : function () {
var onlineStore = Ext.getStore('News'),
localStore = Ext.create('Ext.data.Store', {
model: "default.model.Offline"
}),
me = this;
localStore.load();
onlineStore.on('refresh', function (store,record) {
Ext.Msg.alert('Notice', 'You are in online mode', Ext.emptyFn);
// console.dir(record.data.name);
console.dir(record.get('category_name'));
console.log(record.items[0].raw.category_name);
console.log(record.get('category_name'));
// Get rid of old records, so store can be repopulated with latest details
localStore.getProxy().clear();
store.each(function(record) {
var rec = {
name : record.data.category_name+ ' (from localStorage)' // in a real app you would not update a real field like this!
};
localStore.add(rec);
localStore.sync();
});
});
onlineStore.getProxy().on('exception', function () {
me.getNewsList().setStore(localStore); //rebind the view to the local store
localStore.load(); // This causes the "loading" mask to disappear
Ext.Msg.alert('Notice', 'You are in offline mode', Ext.emptyFn); //alert the user that they are in offline mode
});
}
});
I think, I am not getting value from this record.data.category_nam . Here I am getting first value from this:record.items[0].raw.category_name. So how to store in localstorage.
and View file:
Ext.define('default.view.Main', {
extend : 'Ext.List',
config : {
id : 'newsList',
store : 'News',
disableSelection : false,
itemTpl : Ext.create('Ext.XTemplate',
'{category_name}'
),
items : {
docked : 'top',
xtype : 'titlebar',
title : 'News List'
}
}
});
In localstorage, following output:
category-5ea01a8d-ef1e-469e-8ec4-790ec7306aaf
{"cat_id":null,"category_name":null,"id":"5ea01a8d-ef1e-469e-8ec4-790ec7306aaf"}
category-f3e090dd-8f25-4b20-bb6e-b1a030e07900
{"cat_id":null,"category_name":null,"id":"f3e090dd-8f25-4b20-bb6e-b1a030e07900"}
category-5148e6eb-85ae-4acd-9dcd-517552cf5d97
{"cat_id":null,"category_name":null,"id":"5148e6eb-85ae-4acd-9dcd-517552cf5d97"}
category-ec23ff8b-1faa-4f62-9284-d1281707a9bc
{"cat_id":null,"category_name":null,"id":"ec23ff8b-1faa-4f62-9284-d1281707a9bc"}
category-6c1d
I have display in view but could not store in localstorage for offline propose.where i did wrong, i could not get it.
Record you created should match the SF.model.Offline model.
In your following code
var rec = {
// name is the field name of the `SF.model.Offline` model.
name : record.data.category_name+ ' (from localStorage)'
};
localStore.add(rec);
localStore.sync();
But you see there is no field called name in SF.model.Offline model.
This is how you should do
Models
Ext.define('SF.model.Online', {
extend : 'Ext.data.Model',
config: {
fields: ['cat_id','category_name'],
}
});
Ext.define('SF.model.Offline', {
extend : 'Ext.data.Model',
config: {
fields: ['cat_id','category_name'],
identifier:'uuid',
proxy: {
type: 'localstorage',
id : 'category'
}
}
});
Store
Ext.define('SF.store.Category', {
extend : 'Ext.data.Store',
config : {
model : 'SF.model.Online',
storeId : 'category',
proxy: {
timeout: 3000,
type: 'ajax',
url: 'same url' ,
reader: {
type: "json",
rootProperty: "data"
}
},
autoLoad : true
}
});
In Controller
var onlineStore = Ext.getStore('category'),
localStore = Ext.create('Ext.data.Store', {
model: "SF.model.Offline"
}),
me = this;
localStore.load();
onlineStore.on('refresh', function (store, records) {
localStore.getProxy().clear();
onlineStore.each(function(record) {
//You creating record here, The record fields should match SF.model.Offline model fields
var rec = {
cat_id : record.data.cat_id + ' (from localStorage)',
category_name : record.data.category_name + ' (from localStorage)'
};
localStore.add(rec);
localStore.sync();
});
});
onlineStore.getProxy().on('exception', function () {
me.getNewsList().setStore(localStore);
localStore.load();
Ext.Msg.alert('Notice', 'You are in offline mode', Ext.emptyFn);
});

In Rally SDK 2, how do I update a hash field?

In Rally SDK 2, how do I update a hash field, like the Author field for a changeset? I read how to update the Message field, but I can't figure out how to update Author["DisplayName"] hash.
var new_message = settings.message;
Rally.data.ModelFactory.getModel({
type: 'Changeset',
success: function(model) {
model.load( '1234', {
fetch: [ 'Artifacts' ],
callback: function(result, operation) {
if ( operation.wasSuccessful() ){
var message = new_message;
record.set( 'Message', message);
record.save( {
callback: function( resultset, operation ) {
console.log( "After saving:", resultset );
if ( operation.wasSuccessful() ) {
var that = tree.ownerCt.ownerCt.ownerCt.ownerCt;
that._getChangesets();
}
}
} );
}
}
})
}
});
The Author property on Changeset is of type User. Like any other object associations on Rally's WSAPI you just set this property to the ref of the object you'd like to link. You set this the same way as you're currently setting Message in your above code snippet. (Assuming author is writable after the changeset has already been created).
record.set('Author', '/user/123456');
You can probably also avoid the deeply nested structure of your code a little bit by specifying scope on your callbacks and using member functions in your app definition:
_loadChangesetModel: function() {
//If you already have a changeset record you can get the model
//via record.self. Otherwise, load it fresh.
Rally.data.ModelFactory.getModel({
type: 'Changeset',
success: this._onChangesetModelLoaded,
scope: this
});
},
_onChangesetModelLoaded: function(model) {
model.load( '1234', {
fetch: [ 'Artifacts' ],
callback: this._onChangesetLoaded,
scope: this
});
},
_onChangesetLoaded: function(record, operation) {
if ( operation.wasSuccessful() ){
var message = settings.message;
record.set( 'Message', message);
record.save( {
callback: this._onChangesetSaved,
scope: this
} );
}
},
_onChangesetSaved: function( resultset, operation ) {
console.log( "After saving:", resultset );
if ( operation.wasSuccessful() ) {
//You shouldn't need to do this now that the scope is correct.
//I'm guessing 'that' was referring to the app itself?
//var that = tree.ownerCt.ownerCt.ownerCt.ownerCt;
this._getChangesets();
}
},
_getChangesets: function() {
//refresh
}

Sencha touch: JSONP parsing

Model:
app.models.Category = Ext.regModel("Category", {
fields: [
{ name: 'CategoryId', type: 'int' },
{ name: 'ImageUrl', type: 'string' },
{ name: 'ImageUrlFile', type: 'string' },
{ name: 'CategoyName', type: 'string' }
]
});
Storage:
app.stores.CategoryStore = new Ext.data.Store({
id: 'CategoryStore',
model: 'Category',
autoLoad: true,
proxy: {
type: 'scripttag',
url: 'http://localhost:1303/admin/categoriesservice/getcategories',
mehod: 'GET', //not needed
callbackKey: 'callback', //not needed
reader: {
type: 'json',
root: 'categories'//not needed with my JSONP
},
afterRequest: function (request, success) {
console.log("afterRequest");
if (success) {
console.log("success");
} else {
console.log("failed");
}
console.log(request);
}
}
});
Controller:
Ext.regController('Home', {
index: function () {
if (!this.indexView) {
this.indexView = this.render({
xtype: 'HomeIndex'
});
this.items = [app.views.HomeIndex];
}
app.viewport.setActiveItem(this.indexView);//this what i've missed
}
});
View
app.views.HomeIndex = Ext.extend(Ext.DataView, {
html: '<div class="gallery-view" style="display: block;width: 300px;border: 1px solid #fff;height: 300px;"></div>',
store: app.stores.CategoryStore, //full namespace needed
itemSelector: 'div.node',
initComponent: function () {
this.tpl = new Ext.XTemplate(
'<div style="padding:10px 5px 5px 5px;">',
'<tpl for=".">',
'<div class="node" style="background:url({ImageUrl});">',
'</div>',
'</tpl>',
'</div>'
);
//appened to successful solution
this.dataView = new Ext.DataView({
store: this.store,
tpl: this.xtpl,
itemSelector: 'div.node'
});
this.items = [this.dataView];
app.views.HomeIndex.superclass.initComponent.apply(this, arguments);
}
});
Ext.reg('HomeIndex', app.views.HomeIndex);
JSONP Result:
GetCategories([{"CategoryId":101,"CategoyName":"אוכל","ImageUrl":"http://www.teleclal.com/YnetApplicationMall/Content/images/categories/rest.png","ImageUrlFile":null,"InsertDate":"\/Date(1314507534000)\/","IsActive":true,"ApplicationId":0,"Applications":null},{"CategoryId":99,"CategoyName":"הצגות ומופעים","ImageUrl":"http://www.teleclal.com/YnetApplicationMall/Content/images/categories/shows.png","ImageUrlFile":null,"InsertDate":"\/Date(1314442037000)\/","IsActive":true,"ApplicationId":100,"Applications":null},{"CategoryId":111,"CategoyName":"בריאות","ImageUrl":"http://www.teleclal.com/YnetApplicationMall/Content/images/categories/spa.png","ImageUrlFile":null,"InsertDate":"\/Date(1314856845000)\/","IsActive":true,"ApplicationId":0,"Applications":null},{"CategoryId":142,"CategoyName":"נופש ותיירות","ImageUrl":"http://www.teleclal.com/YnetApplicationMall/Content/images/categories/vacation.png","ImageUrlFile":null,"InsertDate":"\/Date(1314713031000)\/","IsActive":true,"ApplicationId":0,"Applications":null},{"CategoryId":143,"CategoyName":"ביגוד","ImageUrl":"http://www.teleclal.com/YnetApplicationMall/Content/images/categories/clothes.png","ImageUrlFile":null,"InsertDate":"\/Date(1314713031000)\/","IsActive":true,"ApplicationId":0,"Applications":null},{"CategoryId":144,"CategoyName":"אתרים ואטרקציות","ImageUrl":"http://www.teleclal.com/YnetApplicationMall/Content/images/categories/attraction.png","ImageUrlFile":null,"InsertDate":"\/Date(1314713031000)\/","IsActive":true,"ApplicationId":0,"Applications":null},{"CategoryId":105,"CategoyName":"חשמל","ImageUrl":"http://www.teleclal.com/YnetApplicationMall/Content/images/categories/elctronic.png","ImageUrlFile":null,"InsertDate":"\/Date(1314713031000)\/","IsActive":true,"ApplicationId":0,"Applications":null}]);
The exception:
Uncaught TypeError: Cannot read property 'length' of undefined
Question:
Help how can i parse via storage or any other way the JSONP issue???
You have set this in your reader
reader: {
type: 'json',
root: 'categories'
}
And I can't see categories element in your json data. Check if this is correct or add this to your json in order to be working probably
{"categories":[ ...//old json //..]}
when I tried to define
function GetCategories(data){console.log(data);}
and then invoking the jsonp response (by ctrl+c/ctrl+v into the console), I was successful, meaning the the data is a valid json string.
but when I inspected your code, I haven't seen a mechanisem that defines that function (GetCategories).
I must say that i'm unfamilier with sencha. but I aswsome that problem is that no callback function was ever created.
I see that you define a 'callbackKey: 'callback''
is there somewhere in sencha documentation that allows you to define a 'callbackValue: 'GetCategories'' or such? try and check into that direction.
Try removing "autoLoad: true" from your code. It resolved my issues on the same matter as yours.

sencha touch search form

I really hope someone can help me, It seems like this should be obvious but sencha documentation isn't very easy to read and incomplete. I am trying to build a search form but it doesnt seem to take the store or the url and I can't figure out how to add parameters like page? Can anyone help? This code just produces Failed to load resource: null.
var searchField = new Ext.form.Search({
value:'Search',
url: 'someurl',
store: this.data_store,
cls:'searchfield',
listeners: {
focus: function(){ searchField.setValue(''); },
blur: function(){ if( searchField.getValue()=='' ){ searchField.setValue('Search'); } },
success: function(e){
console.log(e);
}
}
});
this.dockedItems = [ searchField ];
Ext.form.FormPanel doesn't take a Ext.data.Store or Ext.data.Model directly but does deal with Instances of Ext.data.Model. Lets say you have the following model:
Ext.regModel('MyForm', {
fields: [{name: 'id', type: 'int'},'name','description']
proxy: {
type: 'ajax',
url: 'url_to_load_and_save_form'
}
})
Now your form definition would look something like this:
Ext.form.MyForm = Ext.extend(Ext.form.FormPanel, {
record : null,
model: 'MyForm',
items: [{
xtype: 'hidden',
name: 'id'
},{
xtype: 'textfield',
name: 'name',
allowBlank: false
},{
xtype: 'textarea',
name: 'description'
}],
submit : function(){
var record = this.getRecord() || Ext.ModelMgr.create({}, this.model);
this.updateRecord(record , true);
record.save({
scope: this,
success : function(record, opts){
this.fireEvent('saved', record);
},
callback: function(){
this.setLoading(false);
}
});
}
});
Ext.reg('MyForm',Ext.form.MyForm);
Of course you should add in some validations and a button to actually call the Ext.form.MyForm.submit method.