I am using Sencha V2. I am trying to populate my list with the values in a Users.json file.
The code in my list file is
Ext.define('iPolis.view.personlist',{
extend:'Ext.List',
xtype: 'personlist',
requires: [
'Ext.List',
'Ext.form.FieldSet',
'Ext.Button'
],
config: {
fullscreen:true,
items: [
{
xtype:'toolbar',
docked:'top',
title:'iPolis',
items:[
{
ui:'back',
icon:'home',
iconCls:'home',
iconMask:true,
id: 'homebtn',
handler:function ()
{
}
},
]
},
{
xtype : 'list',
store : 'personListStore',
itemTpl : '<div class="contact">HI <br/> {name}</div>'
}
}
]
}
});
and the store is calling the file using:
Ext.define('iPolis.store.personListStore', {
extend: 'Ext.data.Store',
storeId:'personListStore',
model : 'iPolis.model.personListModel',
proxy : {
type : 'ajax',
url : '/users.json',
reader: {
type: 'json',
rootProperty: 'users'
}
},
autoLoad: true
});
The code for my json file is:
{
"users": [
{
"id": 1,
"name": "Ed Spencer",
"email": "ed#sencha.com"
},
{
"id": 2,
"name": "Abe Elias",
"email": "abe#sencha.com"
}
]
}
I am gettin a blank screen. I have tried everything but no data is displayed on the screen.
In your list the store is personStore but your trying to use personListStore.
Ext.define('iPolis.store.personListStore', {
extend: 'Ext.data.Store',
config:{
model : 'iPolis.model.personListModel',
storeId:'personListStore',
proxy : {
type : 'ajax',
url : '/users.json',
reader: {
type: 'json',
rootProperty: 'users'
}
},
autoLoad: true } });
try this may help you.
Related
I have Application model with following relation:
#belongsTo(() => Ido)
idoId: string;
export interface ApplicationRelations {
ido?: IdoWithRelations;
}
export type ApplicationWithRelations = Application & ApplicationRelations;
Application repository looks like this:
export class ApplicationRepository extends DefaultCrudRepository<
Application,
typeof Application.prototype.id,
ApplicationRelations
> {
public readonly user: BelongsToAccessor<
User,
typeof Application.prototype.id
>;
constructor(
#inject('datasources.db') dataSource: DbDataSource,
#repository.getter('UserRepository')
protected userRepositoryGetter: Getter<UserRepository>,
) {
super(Application, dataSource);
this.user = this.createBelongsToAccessorFor('user', userRepositoryGetter);
this.inclusionResolvers.delete('ido');
}
}
And the following relation in IDO model:
#hasMany(() => Application)
applications: Application[];
In post /ido in swagger i am getting this example for creating:
{
"applications": [
{
"status": "string",
"createdAt": 0,
"idoId": "string",
"userId": "string",
"ido": {
"applications": [
{
"status": "string",
"createdAt": 0,
"idoId": "string",
"userId": "string",
"ido": {
"applications": [
"string"
],
}
Is there any ways to remove the duplicate and kind of curricular relation for ido in application from swagger? Or this doesn't really matter and i can just manually delete all fields above the first application?
This answer was copied over from https://github.com/loopbackio/loopback-next/discussions/8536#discussioncomment-2655375.
OpenAPI/Swagger is at the REST layer, which means you'll need to look inside the respective REST Controller, which would have something similar to this:
#post('...')
function create(
#requestBody({
content: {
'application/json': {
schema: getModelSchemaRef(Application, {
title: 'NewApplication',
exclude: ['id'],
}),
},
},
})
)
You can modify it as such to exclude relations:
#post('...')
function create(
#requestBody({
content: {
'application/json': {
schema: getModelSchemaRef(Application, {
title: 'NewApplication',
exclude: ['id'],
+ includeRelations: false,
}),
},
},
})
)
An alternative is to use exclude.
More info can be found in the API docs: https://loopback.io/doc/en/lb4/apidocs.repository-json-schema.getjsonschemaref.html
At http://jsonapi.org/format/#fetching-includes
Articles belongs to an author. Articles have many comments. Comments belongs to a user.
Trying to understand how to include nested relationships. Take for example: https://www.foo.com/articles?include=comments
You would expect:
{
data: [
{
id: 1,
type: "articles",
attributes: { ... },
relationships: {
author: { ... },
comments: [{ ... }, { ... }],
},
...
},
{ ... }
]
included: [
{
author: { ... },
comment: { ... },
comment: { ... }
{
]
}
Now lets say, you wanted to include the users who wrote those comments. https://www.foo.com/articles?include=comments.user
Should the response look like:
{
data: [
{
id: 1,
type: "articles",
attributes: { ... },
relationships: {
author: { ... },
comments: [{ ... }, { ... }]
},
...
},
{ ... }
]
included: [
{
author: { ... },
comment: { ... },
comment: { ... },
user: { ... },
user: { ... }
{
]
}
Should users (users who wrote the comments) also be in the relationship node, or just in the included node?
If in the relationship node. Should user be nested inside data.relationships.comments? How would that look?
According to the Top Level documentation, the included field should be an array of Resource Objects. This means your included field should look like this:
"included": [
{
"type": "author",
"id": ...,
"attributes": { ... },
"relationships": { ... }
}, {
"type": "comment",
"id": ...,
"attributes": { ... },
"relationships": { ... }
}
]
Also according to the Relationships documentation, it should (when side-loading data) contain a Resource Linkage data field which will contain either a single Resource Identifier in the case of a belongsTo relationship, or an array of resource identifier objects in the case of a hasMany relationship.
belongsTo resource identifier:
"relationships": {
"author": {
"links": { ... },
"data": { "type": ..., "id": ... }
},
"comments": {
"links": { ... },
"data": [
{ "type": ..., "id": ... },
{ "type": ..., "id": ... }
]
}
}
I have created FIXTURES using ember-model, but i am not able to use following node on template
"logged_in": {
"id" : "1",
"logged": true,
"username": "sac1245",
"account_id": "4214"
}
I have implemented belongsTo relation for this node but it throwing one error : Uncaught Error: Ember.Adapter must implement findQuery
Here i have listed my model code :
Astcart.Application = Ember.Model.extend({
name: Ember.attr(),
logo_url : Ember.attr(),
list: Ember.hasMany('Astcart.List', {key: 'list', embedded: true}),
logged_in: Ember.belongsTo('Astcart.Logged_in', {key: 'logged_in'})
});
Astcart.List = Ember.Model.extend({
name: Ember.attr()
});
Astcart.Logged_in = Ember.Model.extend({
id: Ember.attr(),
logged: Ember.attr(),
username: Ember.attr(),
account_id: Ember.attr()
});
Astcart.Application.adapter = Ember.FixtureAdapter.create();
Astcart.Application.FIXTURES = [
{
"id" : "1",
"logo_url": "img/logo.jpg",
"logged_in": {
"id" : "1",
"logged": true,
"username": "sac1245",
"account_id": "4214"
},
"name": "gau",
"list": [
{
"id" : "1",
"name": "amit"
},
{
"id" : "2",
"name": "amit1"
}
]
}
];
Template code :
{{#each item in model}}
{{item.name}}
{{item.logged_in.logged}}
{{/each}}
Router code :
Astcart.ApplicationRoute = Ember.Route.extend({
model: function() {
return Astcart.Application.find();
}
});
Can any one show me how to access data of above node in template?
Your current fixture have the logged_in data embedded:
Astcart.Application.FIXTURES=[
{
...
"logged_in": {
"id": "1",
"logged": true,
"username": "sac1245",
"account_id": "4214"
},
...
}
];
So the logged_in property mapping need the parameter embedded: true, to be able to find this data, as follow:
Astcart.Application = Ember.Model.extend({
...
logged_in: Ember.belongsTo('Astcart.Logged_in', {key: 'logged_in', embedded: true })
});
Without this it will try to query for the Astcart.Logged_in:
Astcart.Logged_in.find(1)
and because it doesn't have an adapter, will fail with the exception: Uncaught Error: Ember.Adapter must implement findQuery
You can see this working in that fiddle http://jsfiddle.net/marciojunior/8zjsh/
I have added two buttons to my container and now tap on list items not working.Please help.
Code
Ext.define('X.SelectCategories', {
extend: 'Ext.Container',
xtype: 'selectcategorypanel',
id: 'SelectCategories',
requires:[
],
initialize:function(){
this.callParent();
jsonObject = Ext.create('Tablet').make_webservice_call('get_categories');
Ext.getCmp('select_category_list').setData(jsonObject.info);
console.log(jsonObject.info);
//this.getNavigationBar.hide();
},
config: {
//title : 'Select Categories',
//iconCls: 'team',
//styleHtmlContent: true,
// scrollable: true,
layout: {
type: 'fit'
},
items: [
{
//fullscreen: true,
mode: 'MULTI',
/*
layout: {
type: 'fit'
},
*/
//title:'Select Categories',
xtype: 'list',
itemTpl: '{name}',
autoLoad: true,
id:'select_category_list',
store: {
fields: ['name','title']
}
},
{
xtype: 'container',
//fullscreen: true,
layout: {
type: 'vbox'
},
flex : 1,
layout: {
type : 'hbox',
align: 'bottom'
},
defaults: {
xtype : 'button',
flex : 1,
margin: 10
},
items: [
{ui: 'round',ui:"confirm" ,text: 'Save',id: 'categorysaveButton'},
{ui: 'round', ui:"decline" ,text: 'Reset',id: 'categoryresetButton'}
]
}
]
}
})
Try extend Navigationview extend: 'Ext.navigation.View',
I'm experimenting with Sencha Touch 2 at the moment. I made a simple json-store with more items than my screen can display to test scrolling, but every time i try to scroll i get following error:
Uncaught TypeError: Cannot call method 'getCount' of null
I tried to find out whats wrong but could not find a solution yet. Maybe anyone can help?
Here are my sample files:
host.json:
{
"hosts": [
{
"host_name": "host 1",
"status": "pending"
},
{
"host_name": "host 2",
"status": "normal"
},
{
"host_name": "host 3",
"status": "critical"
}
...
]
}
My Store:
Ext.define('myapp.store.MyStore', {
extend: 'Ext.data.Store',
config: {
storeId: 'mystore',
model: 'myapp.model.MyModel',
proxy: {
type: 'ajax',
url: 'host.json',
reader: {
type: 'json',
rootProperty: 'hosts'
}
},
autoLoad: true
}
});
The List-View:
Ext.define('myapp.view.MyListView', {
extend: 'Ext.dataview.List',
alias: 'widget.mylistview',
config: {
items: {
xtype: 'list',
store: 'mystore',
itemTpl: '<div class="service_status_{status}">{host_name}</div>'
}
}
});
And the view where the List-View is called:
Ext.define('myapp.view.Main', {
extend: 'Ext.Container',
config: {
layout: {
type: 'vbox',
aligh: 'stretch'
},
items: [
{
xtype: 'mytoolbar',
docked: 'top',
height: 50
},
{
xtype: 'mylistview',
flex: 1
}
]
}
});
Use 'fit' layout might solve it.
Here is something you definately should change too:
This already defines a list
Ext.define('myapp.view.MyListView', {
extend: 'Ext.dataview.List',
xtype: 'mylistview',
This is the config of the list:
config: {
Here you add a list inside the list, which you are actually using.
This will not go well. This would be a good reason something is not working as expected.
items: {
xtype: 'list',
store: 'mystore',
itemTpl: '<div class="service_status_{status}">{host_name}</div>'
}