ExtJS composite fields

Question

Let me explain my situation:

I have model with array field inside it

Ext.define('MyModel',{
  extend: 'Ext.data.Model',
  fields: [
    { name: 'myfield', type: 'array' }
  ]
})

that contents data like this

data = Ext.create('MyModel',{
  myfield: [ 'one', 'two', 'three', 'four' ]
})

I want to extend Ext.form.field.Base to create field that treats this array as todo-list and contains items inside itself ( Ext.form.field.Trigger to add "todo" and Ext.ListView to display "todo's" ).

I don't know how difficult it is to make Ext.form.field.Base contain items and are there any better possible solutions.

Field must get array on loadRecord() and give it on getRecord() of Form.

Other possible solutions I see:

1) Make Field only with html-template and vanilla-javascript ( bad because why to implement things that are already present in ExtJS )

2) Model relations ( bad because I have to implement 'create, update and delete' for each related model and load them manually )

Thank you for reading, any ideas are welcome!

existdissolve existdissolve · Accepted Answer · 2013-05-29T11:22:23

Not related directly to your question, but "array" is not a valid field type for a Ext.data.Field. Use 'auto' for no data conversion, or just don't assign a type.

Re: the custom, complex form field, it's certainly possible with ExtJS, and creating an extension of the Trigger field is definitely what you'll want to do. Here's an example of a custom trigger field that handles complex data: http://existdissolve.com/2012/12/extjs-4-custom-editor-for-property-grid/. The example is for a custom property grid, but the principle is the same for any custom form field.

The most important parts in your custom field are going to be the implementation of the createPicker() method and whatever mechanism you define for setting the value of the underlying field.

Hope this gives you a good place to start.

ExtJS composite fields

1 Answers