@@ -37,6 +37,26 @@ Formbuilder.extjs.extensions.formDataMappingEditor.formDataMapper = Class.create
3737 return this . editPanel ;
3838 } ,
3939
40+ filterStore : function ( store , storeCollection , additionalAllowedEntities ) {
41+
42+ store . clearFilter ( ) ;
43+
44+ store . filterBy ( function ( rec ) {
45+
46+ var isNotInStoreCollection = storeCollection . findIndexBy ( function ( item ) {
47+ return item . get ( 'value' ) === rec . get ( 'value' ) ;
48+ } ) === - 1
49+
50+ Ext . Array . each ( additionalAllowedEntities , function ( additionalAllowedEntity ) {
51+ if ( rec . get ( 'value' ) === additionalAllowedEntity ) {
52+ isNotInStoreCollection = true ;
53+ }
54+ } ) ;
55+
56+ return isNotInStoreCollection === true ;
57+ } ) ;
58+ } ,
59+
4060 getFormTreePanel : function ( ) {
4161
4262 var treeItems ,
@@ -81,7 +101,9 @@ Formbuilder.extjs.extensions.formDataMappingEditor.formDataMapper = Class.create
81101 expandable : false ,
82102 expanded : true ,
83103 children : [ ] ,
84- apiMapping : Ext . isArray ( apiMappingValues ) ? apiMappingValues : [ ] ,
104+ apiMapping : Ext . isArray ( apiMappingValues ) ? Ext . Array . map ( apiMappingValues , function ( value ) {
105+ return predefinedApiFieldStore . findRecord ( 'value' , Ext . isObject ( value ) ? value . get ( 'value' ) : value ) ;
106+ } ) : [ ] ,
85107 fieldTransformer : fieldTransformer ,
86108 formFieldAttributes : {
87109 fieldData : fieldData
@@ -111,14 +133,6 @@ Formbuilder.extjs.extensions.formDataMappingEditor.formDataMapper = Class.create
111133 return treeItems ;
112134 } . bind ( this ) ;
113135
114- predefinedApiFieldStore . filter ( new Ext . util . Filter ( {
115- filterFn : function ( rec ) {
116- return storeCollection . findIndexBy ( function ( item ) {
117- return item . get ( 'value' ) === rec . get ( 'value' ) ;
118- } ) === - 1 ;
119- }
120- } ) ) ;
121-
122136 treeItems = generateFields ( this . formFieldDefinitions , [ ] , null ) ;
123137
124138 this . formTreePanel = new Ext . tree . TreePanel ( {
@@ -140,7 +154,24 @@ Formbuilder.extjs.extensions.formDataMappingEditor.formDataMapper = Class.create
140154 } ,
141155 plugins : [
142156 Ext . create ( 'Ext.grid.plugin.CellEditing' , {
143- clicksToEdit : 1
157+ clicksToEdit : 1 ,
158+ listeners : {
159+ beforeedit : function ( editor , context ) {
160+
161+ var additionalAllowedEntities = [ ] ;
162+ if ( Ext . isArray ( context . record . get ( 'apiMapping' ) ) ) {
163+ Ext . Array . each ( context . record . get ( 'apiMapping' ) , function ( record ) {
164+ additionalAllowedEntities . push ( ( Ext . isObject ( record ) ? record . get ( 'value' ) : record ) ) ;
165+ } )
166+ }
167+
168+ this . filterStore ( predefinedApiFieldStore , storeCollection , additionalAllowedEntities ) ;
169+
170+ } . bind ( this ) ,
171+ validateedit : function ( ) {
172+ predefinedApiFieldStore . clearFilter ( ) ;
173+ }
174+ }
144175 } )
145176 ] ,
146177 columns : [
@@ -156,6 +187,8 @@ Formbuilder.extjs.extensions.formDataMappingEditor.formDataMapper = Class.create
156187 dataIndex : 'apiMapping' ,
157188 flex : 2 ,
158189 sortable : false ,
190+ editable : true ,
191+ itemId : Ext . id ( ) ,
159192 getEditor : function ( ev ) {
160193
161194 var editor ;
@@ -164,10 +197,11 @@ Formbuilder.extjs.extensions.formDataMappingEditor.formDataMapper = Class.create
164197 return false ;
165198 }
166199
167- editor = Ext . create ( 'Ext. form.field.Tag' , {
200+ editor = new Ext . form . field . Tag ( {
168201 queryDelay : 0 ,
169202 displayField : 'label' ,
170203 valueField : 'value' ,
204+ id : Ext . id ( ) ,
171205 anchor : '100%' ,
172206 store : predefinedApiFieldStore ,
173207 allowBlank : true ,
@@ -178,30 +212,61 @@ Formbuilder.extjs.extensions.formDataMappingEditor.formDataMapper = Class.create
178212 forceSelection : true ,
179213 listeners : {
180214 select : function ( ev , record ) {
181- storeCollection . add ( record ) ;
182- predefinedApiFieldStore . getData ( ) . onFilterChange ( ) ;
183- } ,
215+
216+ if ( Ext . isArray ( record ) ) {
217+ Ext . Array . each ( record , function ( singleRecord ) {
218+ storeCollection . add ( singleRecord ) ;
219+ } ) ;
220+ } else {
221+ storeCollection . add ( record ) ;
222+ }
223+
224+ this . filterStore ( predefinedApiFieldStore , storeCollection , [ ] ) ;
225+ } . bind ( this ) ,
184226 beforedeselect : function ( ev , record ) {
185227 storeCollection . remove ( record ) ;
186- predefinedApiFieldStore . getData ( ) . onFilterChange ( ) ;
187- }
228+ this . filterStore ( predefinedApiFieldStore , storeCollection , [ ] ) ;
229+ } . bind ( this )
188230 }
189231 } ) ;
190232
191233 return editor ;
192234
193235 } . bind ( this ) ,
194- renderer : function ( v , cell , ev ) {
236+ renderer : function ( v , cell , record ) {
195237
196- if ( ev . id === '0' ) {
238+ var storeRecord ;
239+
240+ if ( record . get ( 'id' ) === '0' ) {
197241 return null ;
198242 }
199243
200244 if ( Ext . isArray ( v ) ) {
201- return v . join ( ', ' ) ;
245+
246+ return Ext . Array . merge (
247+ [ ] ,
248+ ...Ext . Array . map ( v , function ( value ) {
249+
250+ var storeRecord ;
251+
252+ if ( Ext . isObject ( value ) ) {
253+ return value . get ( 'label' ) ;
254+ }
255+
256+ storeRecord = predefinedApiFieldStore . findRecord ( 'value' , value ) ;
257+
258+ return storeRecord ? storeRecord . get ( 'label' ) : v ;
259+ } )
260+ ) . join ( ', ' ) ;
261+ }
262+
263+ if ( Ext . isObject ( v ) ) {
264+ return v . get ( 'label' ) ;
202265 }
203266
204- return v ;
267+ storeRecord = predefinedApiFieldStore . findRecord ( 'value' , v ) ;
268+
269+ return storeRecord ? storeRecord . get ( 'label' ) : v ;
205270
206271 } . bind ( this )
207272 } ,
@@ -328,12 +393,23 @@ Formbuilder.extjs.extensions.formDataMappingEditor.formDataMapper = Class.create
328393
329394 var obj ,
330395 formFieldAttributes = child . get ( 'formFieldAttributes' ) ,
331- children = this . getFormFieldsRecursive ( child ) ;
396+ children = this . getFormFieldsRecursive ( child ) ,
397+ apiMapping = [ ] ;
398+
399+ if ( Ext . isArray ( child . get ( 'apiMapping' ) ) ) {
400+ Ext . Array . each ( child . get ( 'apiMapping' ) , function ( record ) {
401+ apiMapping . push ( Ext . isObject ( record ) ? record . get ( 'value' ) : record ) ;
402+ } )
403+ } else if ( Ext . isObject ( child . get ( 'apiMapping' ) ) ) {
404+ apiMapping . push ( child . get ( 'value' ) ) ;
405+ } else if ( Ext . isString ( child . get ( 'apiMapping' ) ) ) {
406+ apiMapping . push ( child . get ( 'apiMapping' ) ) ;
407+ }
332408
333409 obj = {
334410 name : formFieldAttributes . fieldData . name ,
335411 config : {
336- apiMapping : child . get ( ' apiMapping' ) === undefined ? [ ] : child . get ( 'apiMapping' ) ,
412+ apiMapping : apiMapping ,
337413 fieldTransformer : child . get ( 'fieldTransformer' ) === undefined ? null : child . get ( 'fieldTransformer' ) ,
338414 }
339415 }
0 commit comments