Develop Reference

Does Extjs data Model/Store support any wrapper proxy builder method?

We are using Extjs 5.x for building browser based single page application. Everything is working fine if simple model & store used by us. If we are trying to use any wrapper for proxy it's generate error during runtime after having sencha cmd build.
Here is the simple Model of Article:
Ext.define('Pos.model.Article', {
extend : 'Ext.data.Model',
alias : 'widget.Article',
idProperty : 'id',
fields : [
{ name : 'id', mapping : 'id', type : 'int' },
{ name : 'code', mapping : 'code', type : 'string'},
{ name : 'name', mapping : 'name', type : 'string'},
{ name : 'rate', mapping : 'rate', type : 'float' },
{ name : 'expireDate', mapping : 'expireDate', type : 'date' }
],
proxy : {
type : 'rest',
noCache : true,
limitParam : 'limit',
startParam : 'start',
url : '/pos/article',
reader : {
type : 'json',
rootProperty : 'data',
totalProperty : 'total',
successProperty : 'success',
messageProperty : 'message',
implicitIncludes: true
},
writer :{
type : 'json',
writeAllFields : true
},
simpleSortMode : true
}
});
Here is the simple Store of Article:
Ext.define('Pos.store.Articles', {
extend : 'Ext.data.Store',
model : 'Pos.model.Article',
idProperty : 'id',
autoLoad : false,
autoSync : false,
remoteSort : true,
remoteFilter : true,
pageSize : 25,
proxy : {
type : 'rest',
noCache : true,
limitParam : 'limit',
startParam : 'start',
url : '/pos/article/store',
reader : {
type : 'json',
rootProperty : 'data',
totalProperty : 'total',
successProperty : 'success',
messageProperty : 'message',
implicitIncludes: true
},
writer :{
type : 'json',
writeAllFields : true
},
simpleSortMode : true
},
sorters : [{
property : 'name',
direction: 'ASC'
}]
});
When we are using simple model and store it working fine. But our goal was removing boiler plate of code for this reason we are trying to build some wrapper method to remove the redundant codes. Here is the simple wrapper of proxy builder for your consideration:
var Cki=Cki||{};
;Cki.proxy||(function($){
var proxy = {
$package : 'Cki',
$class : 'Cki.proxy',
resolveUrl : function(action){
var ctxPath = '/pos/',
url = ctxPath + action;
return url;
},
getReader : function(){
var reader = {
type : 'json',
rootProperty : 'data',
totalProperty : 'total',
successProperty : 'success',
messageProperty : 'message',
implicitIncludes: true
};
return reader;
},
getWriter : function(){
var writer = {
type : 'json',
writeAllFields : true
};
return writer;
},
getRestProxy : function(url, noCache){
url = (typeof url === 'undefined') ? '' : url;
noCache = (typeof noCache === 'undefined') ? false : noCache;
var restProxy = {
type : 'rest',
noCache : noCache,
limitParam : 'limit',
startParam : 'start',
url : proxy.resolveUrl(url),
reader : proxy.getReader(),
writer : proxy.getWriter(),
simpleSortMode : true
};
return restProxy;
}
};
$.proxy = proxy;
}(Cki));
Once the wrapper of proxy builder method is ready, we could use it for wrapping the proxy inside model and store. Here is the wrapped Proxy Model:
Ext.define('Pos.model.Article', {
extend : 'Ext.data.Model',
alias : 'widget.Article',
idProperty : 'id',
fields : [
{ name : 'id', mapping : 'id', type : 'int' },
{ name : 'code', mapping : 'code', type : 'string'},
{ name : 'name', mapping : 'name', type : 'string'},
{ name : 'rate', mapping : 'rate', type : 'float' },
{ name : 'expireDate', mapping : 'expireDate', type : 'date' }
],
proxy : Cki.proxy.getRestProxy('article')
});
Here is the wrapped Proxy Store:
Ext.define('Pos.store.Articles', {
extend : 'Ext.data.Store',
model : 'Pos.model.Article',
idProperty : 'id',
autoLoad : false,
autoSync : false,
remoteSort : true,
remoteFilter : true,
pageSize : 25,
proxy : Cki.proxy.getRestProxy('article/store'),
sorters : [{
property : 'name',
direction: 'ASC'
}]
});
It's generate following error during runtime:
Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
http://localhost/pos/static/Ext-all.js Failed to load resource: the server responded with a status of 404 (Not Found)fetch # Ext-all.js:22
VM42:3 Uncaught TypeError: c is not a constructor

It's very difficult to find your error without debugging it, and I think it would be very difficult even with the code..
I'd suggest you to change the approach you are using to avoid boilerplate code.
I think the best way to achieve this is to extend the rest proxy class, putting there all the default configs.
Then you just use your proxy class in your store definition, passing just the url (that seems to be the only difference between models).
Example
Ext.define('My.data.proxy.Rest', {
extend: 'Ext.data.proxy.Rest',
alias : 'proxy.myrest',
noCache : true,
limitParam : 'limit',
startParam : 'start',
reader : {
type : 'json',
rootProperty : 'data',
totalProperty : 'total',
successProperty : 'success',
messageProperty : 'message',
implicitIncludes: true
},
writer :{
type : 'json',
writeAllFields : true
},
simpleSortMode : true
});
And in your store you will have
Ext.define('Pos.store.Articles', {
extend : 'Ext.data.Store',
model : 'Pos.model.Article',
idProperty : 'id',
autoLoad : false,
autoSync : false,
remoteSort : true,
remoteFilter : true,
pageSize : 25,
proxy : {
type: 'myrest',
url: '/pos/article/store',
},
sorters : [{
property : 'name',
direction: 'ASC'
}]
});

Extjs 5 Cannot read property 'isBufferedStore' of undefined

Hi I am in trouble with extjs 5 mvvm example. My store isn't recognized. I tried similliar solutions from stack but it still crashing.
Project structure:
structure
Code:
Message.js
Ext.define('Tgis.view.message.Message', {
extend : 'Ext.window.Window',
title: 'Wiadomosci',
requires : ['Tgis.view.message.MessageController'],
store: 'MessageStore',
alias : 'widget.message',
config : {
minHeight: 320,
minWidth:400,
bodyPadding : 10,
width : 500,
ghost : false,
bodyPadding : 10,
autoShow : true
},
items: [{
xtype:'panel',
layout : 'vbox',
items : [
{
xtype : 'mvvm-DateView' ,
flex : 1
},
{
xtype : 'mvvm-MessageView',
flex : 5
}]
}]});
Messagedate.js
Ext.define('Tgis.view.message.MessageDate', {
extend : 'Ext.grid.Panel',
xtype : 'mvvm-DateView',
store : 'MessageStore',
columns: [
{
text : 'Data',
dataIndex : 'date'
}
]});
MessageMaster.js
Ext.define('Tgis.view.message.MessageMaster', {
extend : 'Ext.form.Panel',
xtype : 'mvvm-MessageView',
requires : [
'Tgis.view.message.MessageViewModel'
],
title : 'Wiadomosci',
frame : true,
padding : 10,
viewModel : {
type : 'detailform' // references DetailViewModel
},
items : [
{
xtype : 'textfield',
bind : '{rec.message}',
fieldLabel : 'Tresc:'
},
{
xtype : 'hiddenfield',
bind : '{rec.id}'
}
]});
MessageModel.js
Ext.define('Tgis.view.message.MessageModel', {
extend : 'Ext.data.Model',
fields : [
{
name : 'date',
type : 'date'
},
{
name : 'message',
type : 'string'
},
{
name : 'id',
type : 'integer'
}
]});
Ext.define('Tgis.view.message.MessageStore', {
extend : 'Ext.data.Store',
model : 'Tgis.view.message.MessageModel',
storeId: 'MessageStore',
data : [
{
'date' : '28.05.1994',
'message' : 'lisa#simpsons.com',
'id' : '1'
}
]});
MessageController.js
Ext.define('Tgis.view.message.MessageController', {
extend : 'Ext.app.Controller',
init: function() {
this.control({
'mvvm-DateView': {
select : this.onGridSelect
}
});
},
onGridSelect : function(grid, record, index, eOpts) {
// grab a reference to the Detail view...
// we could have used a controller "ref", but those can also be problematic
var detailView = Ext.ComponentQuery.query('mvvm-DateView')[0];
//set the form's ViewModel binding
detailView.getViewModel().setData({ rec: record });
}});
MessageViewModel.js
Ext.define('Tgis.view.message.MessageViewModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.detailform',
data : {
rec : null
}});
Main.js
xtype: 'app-main',
controller: 'main',
viewModel: {
type: 'main'
},
layout: {
type: 'border'
},
items: [{
xtype: 'panel',
bind: {
title: '{name}'
},
region: 'west',
width: 250,
split: true,
defaultType : 'button',
layout : 'vbox',
items : [{
text : 'Wiadomości',
handler : 'onClickMessages'
},{
text : 'Wyczyść LC',
handler : 'onClearMessages'
}]
},{
region: 'center',
xtype: 'tabpanel',
items:[{
title: 'Tab 1',
html: '<h2>Content appropriate for the current navigation.</h2>'
}]
}]});
MainController.js
Ext.define('Tgis.view.main.MainController', {
extend: 'Ext.app.ViewController',
alias: 'controller.main',
onClickButton: function () {
Ext.Msg.confirm('Confirm', 'Are you sure?', 'onConfirm', this);
},
onConfirm: function (choice) {
if (choice === 'yes') {
//
}
},
onClickMessages : function(button) {
Ext.Ajax.request({
url : 'http://localhost:8080/Messagess/res',
method : 'GET',
success : function(response) {
var json = Ext.decode(response.responseText);
//var itemsArray = new Array();
/*for (var i = 0; i < json.data.length; i++) {
var date = new Date(json.data[i].date);
var messageTxt = Ext.create('Ext.form.field.TextArea', {
fieldLabel :date.toLocaleString(),
value : json.data[i].message,
editable : false,
grow : true,
width : '100%'
});
if (localStorage.getItem('date') != 'null')
itemsArray.push(messageTxt);
}
var checkbox = Ext.create('Ext.form.field.Checkbox', {
id : 'checkboxmessage',
boxLabel : 'Nie pokazuj ponownie'
});
itemsArray.push(checkbox);*/
Ext.create('Tgis.view.message.Message', {
//messagess: json.data
//Ext.getCmp('usernameID').setValue('JohnRambo');
/*items: itemsArray,
buttons : [{
xtype : 'button',
text : 'Zamknij',
handler : 'onCloseClick'
}]*/
})
}
});
},
onClearMessages : function(button) {
localStorage.setItem('date', '0');
}});
MainModel.js
Ext.define('Tgis.view.main.MainModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.main',
data: {
name: 'Tgis'
}});

Call store like this in view solved in my project
store: {
type: 'MessageStore'
}

You have defined a "store template" but not created a store instance.
If you want to create multiple stores of that type (e.g. one for each grid), do it like this:
xtype:'grid',
store:Ext.create('MyApp.store.SomeStore',{
...
}),
If you only want a single store of that type, just add the store to stores:[] array in Application.js and it should work.

Extjs 3.4 Combo - How to make select function fire

ComboCode
var applicationStore = new Ext.data.Store({
autoLoad : true,
url : 'index.php',
method : 'post',
baseParams : {action : 'getListApplication'},
idProperty : 'id',
sortInfo : {field : 'APPLICATION_REF', direction : 'ASC'},
reader : new Ext.data.JsonReader({
fields : [
{name: 'id', type: 'integer'},
{name: 'APPLICATION_ACTION', type: 'STRING'},
{name: 'APPLICATION_ID', type: 'integer'},
{name: 'APPLICATION_REF', type: 'string'},
{name: 'APPLICATION_LABEL', type: 'string'}
]
})
});
var formUserIDPannel = new Ext.form.ComboBox({
/*id : 'formUserIDPannel',
title : 'Liste des Applications',*/
renderTo : 'principalContainer',
/*frame : true,
padding : 0,
labelWidth : 95,*/
//items : [ {
id : 'combo',
xtype : 'combo',
fieldLabel : 'Application',
emptyText : 'Selectionnez une application',
anchor : '97%',
style : 'text-align:center;',
labelStyle : 'font-weight:bold;',
labelSeparator : '',
store : applicationStore,
tpl : '<tpl for="."><div ext:qtip="{APPLICATION_LABEL}" class="x-combo-list-item">{APPLICATION_REF}</div></tpl>',
displayField : 'APPLICATION_REF',
valueField : 'APPLICATION_LABEL',
mode : 'local',
triggerAction : 'all',
hiddenName : 'APPLICATION_ID',
hiddenValue : 'APPLICATION_ID',
selectODFocus: :true,
editable : false ,
listeners : {
'select': function(combo, record, index) {
}
// }]
}
});
/*var formUserIDPannel = new Ext.FormPanel({
id : 'formUserIDPannel',
title : 'Liste des Applications',
renderTo : 'principalContainer',
frame : true,
padding : 0,
labelWidth : 95,
items : [ {
xtype : 'combo',
id : 'CAD_ID_COMBO',
name : 'CAD_ID_COMBO',
fieldLabel : 'Application',
labelStyle : 'font-weight:bold',
anchor : '80%',
labelSeparator : '',
emptyText : 'Selectionnez une application',
store : new Ext.data.ArrayStore({
id : 0,
fields : [ 'id', 'value' ],
data : [ [ 1, 'TMS' ], [ 2, 'SOFT' ], [ 3, 'Autres' ], ]
}),
displayField : 'value',
valueField : 'id',
hiddenName : 'APPLICATION_ID',
hiddenValue : 'APPLICATION_ID',
mode : 'local',
triggerAction : 'all',
editable : true
} ]
});*/
var application = Ext.data.Record.create([
{name: 'id', type: 'integer'},
{name: 'APPLICATION_ACTION', type: 'string'},
{name: 'APPLICATION_ID', type: 'integer'},
{name: 'APPLICATION_REF', type: 'string'},
{name: 'CADENCE', type: 'integer'},
{name: 'PRICE', type: 'integer'}
]);
var gridStore = new Ext.data.GroupingStore({
reader : new Ext.data.JsonReader({fields: application}),
autoLoad : true,
url : 'index.php',
method : 'post',
baseParams : {action : 'getListApplication'},
sortInfo : {field: 'APPLICATION_REF', direction: 'ASC'}
});
var editor = new Ext.ux.grid.RowEditor({saveText : 'Sauvegarder', cancelText : 'Annuler'});
editor.on('canceledit', function(roweditor, cancel){
if(cancel)
{
if(grid.getSelectionModel().getSelected().get('APPLICATION_ACTION') == 'add')
{
gridStore.remove(grid.getSelectionModel().getSelected());
}
}
//Ext.getCmp('buttonAddApplication').setDisabled(false);
});
editor.on('validateedit', function(roweditor, change, record, rowIndex){
var setRecord = new Array();
if(record.get('APPLICATION_ACTION') == 'add')
{
setRecord = change;
}
else if(record.get('APPLICATION_ACTION') == 'update')
{
for(i in change)
{
setRecord.push({'key' : i, 'value' : change[i]});
}
}
sendAjax({
url : 'index.php',
showBusy : false,
params : {action : 'actionCadence', data : Ext.encode({actionBDD : record.get('APPLICATION_ACTION'), 'APPLICATION_ID' : record.get('APPLICATION_ID'), where : [{'key' : 'APPLICATION_ID', 'val':record.get('APPLICATION_ID')}], set : setRecord})},
method : 'post',
renderVar : 'responseJSON',
successCallback : {
functionName : function() {
//Ext.getCmp('buttonAddApplication').setDisabled(false);
Ext.alert.msg(responseJSON.title, responseJSON.message);
if(responseJSON.success == true)
{
if(Ext.getCmp('gridApplication').getSelectionModel().getSelected().get('APPLICATION_ACTION') == 'add')
{
if(Ext.isDefined(responseJSON.APPLICATION_ID))
{
Ext.getCmp('gridApplication').getSelectionModel().getSelected().set('APPLICATION_ID', responseJSON.APPLICATION_ID);
}
Ext.getCmp('gridApplication').getSelectionModel().getSelected().set('APPLICATION_ACTION', 'update');
}
}
else
{
if(Ext.getCmp('gridApplication').getSelectionModel().getSelected().get('APPLICATION_ACTION') == 'add')
{
Ext.getCmp('gridApplication').getStore().remove(Ext.getCmp('gridApplication').getSelectionModel().getSelected());
}
editor.stopEditing();
}
}
}
});
});
var reseizer = new Ext.ux.PanelResizer({minHeight: 250, maxHeight: 800});
var filters = new Ext.grid.GridFilters({
local : true,
filters:[
{type: 'string', dataIndex: 'APPLICATION_REF'}
]
});
var grid = new Ext.grid.GridPanel({
id : 'gridApplication',
store : gridStore,
width : 500,
height : 600,
selModel : new Ext.grid.RowSelectionModel({singleSelect : true}),
title : 'Détails des Applications',
renderTo : 'gridContainer',
autoHeight : false,
stripeRows : true,
frame : true,
loadMask : true,
enableColumnMove : false,
enableDragDrop : false,
autoExpandColumn : 'APPLICATION_REF',
plugins : [editor, reseizer,filters],
view : new Ext.grid.GroupingView({markDirty: false}),
//plugins :[filters, new Ext.ux.grid.GroupSummary()],
columns : [ {
id : 'APPLICATION_REF',
header : 'Tache/Opératrion ',
dataIndex : 'APPLICATION_REF',
width : 200,
sortable : true,
},{
header : 'Cadence',
dataIndex : 'CADENCE',
width : 150,
sortable : true,
editor : {
xtype : 'textfield',
allowBlank : true
}
},{
header : 'Prix',
dataIndex : 'PRICE',
width : 150,
sortable : true,
editor : {
xtype : 'textfield',
allowBlank : true
}
}
]
});

This is from ExtJS 4.2
Try Select without the quotes
listeners: {
select: function (combo, records) {
//do your stuff here
}
}

Could not load the grid with ajax post request

I need to get some data with making ajax request and load the grid (which is empty first) with this data but even i get the data i couldnt load it to the grid.
What i'm doing wrong?
Here is my grid :
var gridFlightForms = Ext.create('Ext.grid.Panel', {
id : 'gridFlightForms',
store : storeFlightFormList,
width : '100%',
height : 300,
collapsible : false,
multiSelect : false,
autoScroll : true,
disableSelection : false,
monitorWindowResize : true,
viewConfig : {
stripeRows : true,
enableTextSelection : true
},
title : 'Flight Forms ',
bbar : Ext.create('Ext.ux.statusbar.StatusBar', {
id : 'gridData-statusbar',
defaultText : '',
defaultIconCls : 'default-icon',
}),
verticalScroller : {
xtype : 'paginggridscroller',
},
columns : [ {
text : '<fmt:message key="common.number.text" />',
xtype : 'rownumberer',
width : 40,
sortable : false
}, {
text : 'Form Id',
menuDisabled : true,
dataIndex : 'formId',
width : 150,
}, {
text : 'Form no',
menuDisabled : true,
dataIndex : 'formNo',
width : 150,
}, {
text : 'Form Type',
menuDisabled : true,
dataIndex : 'formType',
width : 150,
}, {
text : 'Flight Id',
menuDisabled : true,
dataIndex : 'flightId',
width : 150,
}, {
text : 'Revision',
menuDisabled : true,
dataIndex : 'revision',
width : 150,
}, {
text : 'IsLiex',
menuDisabled : true,
dataIndex : 'isLiex',
width : 150,
}, {
text : 'IsPrimary',
menuDisabled : true,
dataIndex : 'isPrimary',
width : 150,
}, {
text : 'Step Number',
menuDisabled : true,
dataIndex : 'stepNumber',
width : 150,
} ]
});
and my store :
var storeFlightFormList = Ext.create('Ext.data.Store', {
model : flightListModelName,
autoLoad : false,
proxy : {
type : 'ajax',
actionMethods : {
read : 'POST'
},
reader : {
type : 'json',
root : 'data'
},
api : {
read : flightFormListUrl
}
},
listeners : {
load : function(store, records) {
}
}
});
and that part is making post and try to load data to grid. I think this part is wrong.
Actually i can see data in resp.data when i debug it, but i cant store it as i mentioned before.
postDataAsParamsINN(
{flightId : flightId},flightFormListUrl,function(resp) {
gridFlightForms.setLoading(true,true);
storeFlightFormList.loadRawData(resp.data,false);
});
Ext.getCmp('gridFlightForms').getStore().load();
I'm pretty new at extjs, thanks in advance.

I'm not quite sure what postDataAsParamsINN is supposed to be doing, you should not need to be loading the data in yourself.
This fiddle demonstrates a working grid that uses a JSON store.
Here is the code:
Ext.application({
name: 'Fiddle',
launch: function() {
var store = Ext.create('Ext.data.JsonStore', {
storeId: 'simpsonsStore',
fields: ['name', 'email', 'phone'],
autoLoad: true,
proxy: {
type: 'ajax',
url: 'data1.json',
reader: {
type: 'json',
rootProperty: 'characters'
}
},
listeners: {
load: function() {
console.log(this);
}
}
});
Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: store,
columns: [{
text: 'Name',
dataIndex: 'name'
}, {
text: 'Email',
dataIndex: 'email',
flex: 1
}, {
text: 'Phone',
dataIndex: 'phone'
}],
height: 200,
width: 400,
renderTo: Ext.getBody()
});
}
});
Once you've bound your store to the grid it automatically fills the grid with whatever information is loaded into the store and refreshes when the store is updated.

Cannot see text for tree nodes when store for TreePanel is defined inline

I am having an issue where I cannot see the text of the tree nodes when defining a TreePanel with an inline store. However, if I externalize the store definition and move it to a separate variable and then assign it TreePanel as shown in the API docs it works perfectly fine.
Following is the code snippet for TreePanel and a screenshot of how it looks like when it is rendered:
Ext.define('MyApp.view.MyViewport', {
extend: 'Ext.container.Viewport',
initComponent: function() {
var me = this;
Ext.applyIf(me, {
items: [ {
xtype: 'treepanel',
title: 'My Tree Panel',
displayField: 'text',
store: {
"id" : "xwt-gen-92bb1629-2cfe-43c1-a40a-a8a2c4e26562",
"owners" : ["booktaxi.tree"],
"storeId" : "xwt-gen-6310be92-f272-4926-8392-ed0eacd04952",
"fields" : [],
"root" : {
"children" : [{
"children" : [],
"expandable" : false,
"id" : "775aa413-72af-4708-b2f1-8852a660cd0a",
"leaf" : true,
"root" : false,
"text" : "detention"
}, {
"children" : [{
"children" : [],
"expandable" : false,
"id" : "f2cbb9c3-c177-4870-a2f2-dceb54a781ab",
"leaf" : true,
"root" : false,
"text" : "book report"
}, {
"children" : [],
"expandable" : false,
"id" : "a4550d10-385e-4c2e-b6da-9f439cab8bd4",
"leaf" : true,
"root" : false,
"text" : "alegrbra"
}
],
"expandable" : true,
"id" : "ba8910a3-7e3f-4959-bcd0-9b3c102c40d4",
"leaf" : false,
"root" : false,
"text" : "homework"
}, {
"children" : [],
"expandable" : false,
"id" : "4f855b01-24ab-400a-ad7d-0dff14ca9710",
"leaf" : true,
"root" : false,
"text" : "buy lottery tickets"
}
],
"expanded" : true,
"id" : "a7d67f78-1a32-4077-8ce3-778b40de1835",
"leaf" : false,
"root" : true,
"text" : ""
},
"xtype" : "store.tree"
},
viewConfig: {
}
}
]
});
me.callParent(arguments);
}
});
I was wondering if some one has faced this issue before and if there is a way to fix this.

You should specify the fields in the store definition, because you are not specifying the model explicitly.

Rename dispalyField for displayField:
Ext.applyIf(me, {
items: [ {
xtype: 'treepanel',
title: 'My Tree Panel',
dispalyField: 'text', <---- ** displayField **
EDIT:
On tree View:
this.columns = [{
header : "Name header 1",
xtype : 'treecolumn',
iconCls : '',
dataIndex : 'index1',
flex : 1
},{
header : "Name header 2",
dataIndex : 'index2'
},{
header : "Name header 3",
dataIndex : 'index3'
},{
header : "Name header 4",
dataIndex : 'index4'
},{
header : "Name header 5",
dataIndex : 'index5'
}];
dataIndex need to be the same name on data defined.
"children" : [{
index1 : 'file', // Father name
index2 : 'data1'
...
children : [{
index1 : 'children file',
index2 : 'children data1',
...
leaf : true
}]
}]