model - Populating a grid with json webservice extjs -


i have web service returns json. json this:

aaa( {     "data":          {             "error":0,             "totalproperty":3,             "groups":                 [                     {                         "users":                             [                                 {                                     "email":"natalia.busto@geograma.com",                                     "name":"natalia",                                     "surname":"busto jimenez",                                     "rol":"user"                                 }                             ],                         "description":"grupo por defecto del dominio demo",                         "name":"default",                                                      "numusers": 1                     },                     {                         "users":                             [                                 {                                     "email":"gorka.lopez@geograma.com",                                     "name":"gorka",                                     "surname":"lópez rivacoba",                                     "rol":"siteadministrator"                                 },                                 {                                     "email":"endika.sanchez@geograma.com",                                     "name":"endika",                                     "surname":"sánchez gutiérrez",                                     "rol":"user"                                 },                                 {                                     "email":"ignacio.gamez@geograma.com",                                     "name":"ignacio",                                     "surname":"gámez ramírez",                                     "rol":"administrator"                                 }                             ],                         "description":"grupo nuevo creado para el dominio demo",                         "name":"group1",                                                     "numusers": 3                     },                     {                         "users":[],                         "description":"group2 description",                         "name":"group2",                         "numusers": 0                     }                 ],             "metadata":                 {                     "request time":"16 ms"                 }         },     "success":true } 

)

i want create model , store data put parameters description, name , numusers grid.

the ext.data.model next one:

ext.define('data', {         extend: 'ext.data.model',         hasmany: [{ model: 'group', name: 'groups' }]     });  ext.define("group", {     extend: 'ext.data.model',     fields: [         { type: 'string', name: 'description' },         { type: 'string', name: 'name' },         { type: 'int', name: 'numusers' },     ],     belongsto: 'data' }); 

the store data next

this.store = ext.create('ext.data.store', {         model: 'data',         proxy: {             type: 'ajax',             url : 'http://100.100.100.165:8080/ums_servlet_1_0/services/ums?request=getgroups&username=endika.sanchez@geograma.com&key=9856a705-0a2c-4f35-bbc9-f12d15ab234u&callback=aaa&extendedinfo=true&filter',             reader: {                 type: 'json',                 root: 'data',                 idproperty: 'name'             }         },     }); 

and grid panel next one

 var itemsperpage = 8;   // set number of items want per page     this.store.load({         params:{             start:0,             limit: itemsperpage         }     });       this.grid = new ext.grid.panel(              {                 cls: this.class_name + '_grid',                 autoscroll: true,                 store: this.store,                 flex: 1,                 style: 'border: solid rgb(234,234,236) 1px',                 columns: [                           { header: 'nombre', dataindex: 'name',flex:1 },                           { header: 'descripción', dataindex: 'description',flex:2},                           { header: 'número usuarios', dataindex: 'numuser',flex:2},                           { xtype:'actioncolumn',                                 width:24,                                 menudisabled: true,                                 items: [{                                     icon: 'img/edit.png',                                      iconcls: 'edit_delete',                                     tooltip: 'editar',                                     handler: function(){}                                 }]                           },                           { xtype:'actioncolumn',                                width:24,                                menudisabled: true,                                items: [{                                     icon: 'img/delete.png',                                     iconcls: 'edit_delete',                                     tooltip: 'eliminar',                                     handler: function(){}                                }]                            }                 ],                 dockeditems: [{                     xtype: 'pagingtoolbar',                     store: this.store,   // same store gridpanel using                     dock: 'bottom',                     displayinfo: true                 }],      }); 

this paint grid dont put data of json webservice inside grid. problem?

you need give store name in grid panel, otherwise grid won't identify store. follow steps.

in store:

ext.define('datastorename', {     extend: 'ext.data.store',     model: 'data',     proxy: {         type: 'ajax',         url : 'url.....',         reader: {             type: 'json',             root: 'data',             idproperty: 'name'         }     } }); 

in grid panel

this.grid = new ext.grid.panel(      {         cls: this.class_name + '_grid',         autoscroll: true,         store: 'datastorename',         flex: 1,         style: 'border: solid rgb(234,234,236) 1px',         columns: [         ]     }); 

Comments

Popular posts from this blog

basic authentication with http post params android -

vb.net - Virtual Keyboard commands -

c++ - End of file on pipe magic during open -