I have a JSON store which read data from webservice.
The JSON from the webservice is valid (I've tried reading the data directly from file and it was working).
Here is the JSON Data:
{
"type": "FeatureCollection",
"name": "Points",
"keyField": "GPSUserName",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
35.19999,
31.780965
]
},
"properties": {
"GPSId": "<img src=images/battery3.png />",
"DateTime": "12/07/2013 09:05:00",
"GPSUserName": "13",
"GPSUserColor": "#00FF57",
"GPSUserIcon": "marker_red2.png",
"GPSLabelPosX": "6",
"GPSLabelPosY": "7"
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
35.201142,
31.780699
]
},
"properties": {
"GPSId": "<img src=images/battery4.png />",
"DateTime": "12/07/2013 09:05:00",
"GPSUserName": "14",
"GPSUserColor": "#00FF57",
"GPSUserIcon": "marker_red2.png",
"GPSLabelPosX": "6",
"GPSLabelPosY": "7"
}
}
]
}
When using the following store , everything is working fine :
initComponent: function () {
this.store = new Ext.data.JsonStore({
storeId: 'usersStore',
autoLoad: true,
autoSync: false,
proxy: {
type: 'ajax',
url: 'data/users.json',
reader: {
type: 'json',
root: 'features'
}
},
fields: [
{ name: 'name', mapping: 'properties.GPSUserName'},
{ name: 'date', mapping: 'properties.DateTime' },
{ name: 'battery', mapping: 'properties.GPSId' }
]
});
this.columns = [
{ header: 'name', dataIndex: 'name', flex: 1 },
{ header: 'date', dataIndex: 'date', flex: 3 },
{ header: 'battery', dataIndex: 'battery', flex: 1 }
];
this.callParent(arguments);
}
but when I change to use a webservice (which returns the file content) nothing works:
initComponent: function () {
this.store = new Ext.data.JsonStore({
storeId: 'usersStore',
autoLoad: true,
autoSync: false,
proxy: new Ext.data.HttpProxy({
url: 'service.asmx/GetJson',
headers: { 'Content-Type': 'application/json; charset=utf-8;' },
reader: { root: 'd', record: 'features' }
}),
fields: [
{ name: 'name', mapping: 'properties.GPSUserName'},
{ name: 'date', mapping: 'properties.DateTime' },
{ name: 'battery', mapping: 'properties.GPSId' }
]
});
this.callParent(arguments);
}
and this is the webservice :
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true, XmlSerializeString = false)]
public string GetJson()
{
string res = File.ReadAllText("data\users.json");
return res;
/*HttpContext.Current.Response.Clear();
HttpContext.Current.Response.ContentType = "application/json";
HttpContext.Current.Response.Charset = "utf-8";
HttpContext.Current.Response.Write(res);*/
}
In firebug I see the following returns from the call :
So ... what am I missing here ?
What you are missing is the buggy implementation of ExtJS JsonStore in ExtJS 4.2. If you look at the source code of this class, you will see that it is ignoring your proxy configuration:
Ext.define('Ext.data.JsonStore', {
extend: 'Ext.data.Store',
alias: 'store.json',
requires: [
'Ext.data.proxy.Ajax',
'Ext.data.reader.Json',
'Ext.data.writer.Json'
],
constructor: function(config) {
config = Ext.apply({
proxy: {
type : 'ajax',
reader: 'json',
writer: 'json'
}
}, config);
this.callParent([config]);
}
});
Just use the Ext.data.Store class and everything should be find. Lost a lot of time on this before figuring this out.
Related
As explained in the NextJs documentation: https://nextjs.org/docs/api-reference/next.config.js/headers , it is possible to configure the HTTP headers of a page using the code below, however my code is not working.
Next Example:
module.exports = {
async headers() {
return [
{
source: '/about',
headers: [
{
key: 'x-custom-header',
value: 'my custom header value',
},
{
key: 'x-another-custom-header',
value: 'my other custom header value',
},
],
},
]
},
}
My Code:
module.exports = {
async headers() {
return [
{
source: '/about',
headers: [
{
key: 'cache-control',
value: 'max-age=31536000',
},
],
},
]
},
}
I have my schema set up almost exactly how I want it in redux state, except I want to add an array of form ids to the formTemplate object.
It would look like this:
// Normalized Form Templates
{
1: {
id: '1',
isGlobal: true,
name: 'Form Template Name',
forms: [1, 2], // This is the line I want to add...but how?
},
}
// Normalized Forms
{
1: {
id: '1',
createdAt: '2016-12-28T23:30:13.547Z',
name: 'Form 1',
parentTemplate: '1',
pdfs: [1, 2],
},
2: {
id: '2',
createdAt: '2016-12-28T23:30:13.547Z',
name: 'Form 2',
parentTemplate: '1',
pdfs: [],
},
}
Here is my schema
import { schema } from 'normalizr'
const formTemplate = new schema.Entity('formTemplates', {}, {
processStrategy: value => ({
id: value.id,
name: value.attributes.title,
isGlobal: value.attributes.is_global,
}),
})
const form = new schema.Entity('forms', {
pdfs: [pdf],
}, {
processStrategy: value => ({
id: value.id,
createdAt: value.attributes.created_at,
name: value.attributes.title,
parentTemplate: value.attributes.form_template_id,
pdfs: [...value.relationships.documents.data],
}),
})
const pdf = new schema.Entity('pdfs')
export default {
data: [form],
included: [formTemplate],
}
This is an example of the API response that I'm normalizing
{
"data": [
{
"id": "5",
"type": "provider_forms",
"attributes": {
"title": "Form 1",
"created_at": "2017-01-02T06:00:42.518Z",
"form_template_id": 1
},
"relationships": {
"form_template": {
"data": {
"id": "1",
"type": "form_templates"
}
},
"documents": {
"data": [ // some pdf data here ]
}
}
}
],
"included": [
{
"id": "1",
"type": "form_templates",
"attributes": {
"title": "Form Template",
"created_at": "2016-12-29T22:24:36.201Z",
"updated_at": "2017-01-02T06:00:20.205Z",
"is_global": true
},
}
]
}
You won't be able to do this with Normalizr because the form template entity has no context back to the forms entities. Your actions/reducer need to handle this.
Okay I figured out a way to do this. I changed my formTemplate entity to map them in manually like so:
const formTemplate = new schema.Entity('formTemplates', {}, {
processStrategy: (value, parent) => {
// eslint-disable-next-line eqeqeq
const childrenForms = parent.data.filter(form => form.attributes.form_template_id == value.id)
return {
id: value.id,
name: value.attributes.title,
isGlobal: value.attributes.is_global,
forms: childrenForms.map(form => form.id),
}
},
})
I have a Meteor application with a Mongo database containing documents with the following structure:
_id: "1234567890",
blocks: [{
type: "block",
block_id: "foobar",
items: [
{
type: "sub",
sub_id: "111",
items: [
{
type: "question",
question_id: "aaa"
},
{
type: "question",
question_id: "bbb"
}
]
},
{
type: "question",
question_id: "aaa"
}
]
}]
I want to be able to find all the questions with a question_id of 'aaa'. So far I have tried these queries, but am struggling to return any results:
questions = MyColl.find({
$or: [{
blocks: {
items: {
$elemMatch: {question_id: 'aaa'}
}
}
},{
blocks: {
items: {
type: "sub",
items: {
question_id: 'aaa'
}
}
}
}]
}).count();
Any ideas?
This is how I mananged it:
questions = MyColl.find({
$or: [{
'blocks.items': {
$elemMatch: {question_id: 'aaa'}
}
},{
'blocks.items.items': {
$elemMatch: {question_id: 'aaa'}
}
}]
}).count();
You can see my code about grid.
Here, Window opens but there is not any value in my grid.
Could you please help?
My php returns JSON encode blow:
{"results":3,"disPath":"","success":"true","rows":[{"id":"1","faz":"Faz1"},{"id":"2","faz":"Faz2"},{"id":"3","faz":"Faz3"}]}
Code
Ext.define('MyDesktop.GridFazlar', {
extend: 'Ext.ux.desktop.Module',
requires: [
'Ext.data.ArrayStore',
'Ext.util.Format',
'Ext.grid.Panel',
'Ext.grid.RowNumberer'
],
id:'grid-fazlar',
init : function(){
this.launcher = {
text: 'Fazlar',
iconCls:'icon-grid'
};
},
createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('grid-fazlar');
if(!win){
var fazlarGridStore = new Ext.data.JsonStore({
root: 'rows',
autoLoad: true,
totalProperty: 'results',
remoteSort: true,
proxy: new Ext.data.HttpProxy({
url: 'phps/gridPhasesLoader.php',
actionMethods: {
create : 'POST',
read : 'POST',
update : 'POST',
destroy: 'POST'
},
}),
baseParams:{
depth: '2',
parentId: '2',
proccess: 'callGrid',
},
fields: [{
name :'id'
},{
name :'faz'
},
//{
]
});
win = desktop.createWindow({
id: 'grid-fazlar',
title:'Fazlar',
width:740,
height:480,
iconCls: 'icon-grid',
animCollapse:false,
constrainHeader:true,
layout: 'fit',
listeners:{
beforeshow: function(){
fazlarGridStore.proxy.extraParams = {
depth: '2',
parentId: '2',
proccess: 'callGrid',
};
}
},
items: [
{
border: false,
xtype: 'grid',
listeners: {
celldblclick : function() {
alert('Deneme');
},
},
contextMenu: new Ext.menu.Menu({
items:[
{
id:'grid-fazlar_menu_denemebutton',
text: 'DenemeButonu',
listeners: {
click: function(){
alert('sssss');
}
}
}
]
}),
store:fazlarGridStore,
columns: [
new Ext.grid.RowNumberer(),
{
text: "ID",
//flex: 1,
width: 70,
sortable: true,
dataIndex: 'id'
},{
text: "Faz",
//flex: 1,
width: 70,
sortable: true,
dataIndex: 'faz'
},
]
}
],
tbar:[{
text:'Add Something',
tooltip:'Add a new row',
iconCls:'add'
}, '-', {
text:'Options',
tooltip:'Modify options',
iconCls:'option'
},'-',{
text:'Remove Something',
tooltip:'Remove the selected item',
iconCls:'remove'
}]
});
}
return win;
},
statics: {
getDummyData: function () {
return [
['Faz1','06/06/2011','15/08/2010','19/12/2010'],
['Faz2','01/10/2010','15/11/2010','29/11/2011'],
['Faz3','16/11/2010','16/12/2010','14/02/2011'],
['Faz4','19/03/2011','20/03/2011','18/06/2011'],
['Faz5','21/03/2011','20/05/2011','18/08/2011'],
['Faz6','21/05/2011','05/07/2011','18/09/2011'],
['Faz7','06/07/2011','04/09/2011','06/12/2011'],
['Faz8','30/09/2011','30/10/2011','29/12/2011'],
];
}
}
});
Your Json has a custom root : 'rows'. You must configure your datareader to take this into account:
proxy: {
type: 'ajax',
url: 'phps/gridPhasesLoader.php',
actionMethods: {
create : 'POST',
read : 'POST',
update : 'POST',
destroy: 'POST'
},
reader: {
type: 'json',
root: 'rows'
}
},
Ext.define('MyApp.model.Facility', {
extend: 'Ext.data.Model',
requires: [
'Ext.data.proxy.Ajax'
],
config: {
fields: [
{
name: 'FacilityId'
},
{
name: 'FacilityName'
}
]
}
});
Ext.define('MyApp.store.FacilityStore', {
extend: 'Ext.data.Store',
requires: [
'MyApp.model.Facility'
],
config: {
autoLoad: true,
model: 'MyApp.model.Facility',
storeId: 'FacilityStore',
proxy: {
type: 'ajax',
batchActions: false,
url: 'http://localhost/QuickFind/Services/EquipmentService.asmx/GetFacilities',
headers: {
'content-type': 'application/json'
},
reader: {
type: 'json',
rootProperty: 'd'
}
}
}
});
And trying the load the data into the list.
Ext.define('MyApp.view.facilityList', {
extend: 'Ext.dataview.List',
alias: 'widget.facilityList',
config: {
docked: 'top',
height: 200,
id: 'datalist',
ui: 'round',
scrollable: true,
store: 'FacilityStore',
onItemDisclosure: true,
itemTpl: [
'<div><p>{Facility.FacilityName}</p></div>'
]
}
});
and my controller launch i am binding the data to the list:
Ext.define('MyApp.controller.Facility', {
extend: 'Ext.app.Controller',
config: {
refs: {
dataList: '#dataList',
mainNav: 'mainNav'
}
},
launch: function() {
var me = this;
debugger;
Ext.getStore('FacilityStore').load();
var group_store = Ext.getStore("FacilityStore");
me.facilityList.setStore(group_store);
}
Store is loaded with records but it's not displaying in the list.
I hope u have solved ur problem by this moment,but still to answer the question u have posted..the problem is the itemtpl u have written..
ur's
itemTpl: [
'<div><p>{Facility.FacilityName}</p></div>'
]
The field u have mentioned is FacilityName so to get the record's from the store Facility
U just need to do this in ur itemtpl to get data in list:
itemTpl: [
'<div><p>{FacilityName}</p></div>'
]