In our recent webinar on Creating Data Intensive Application Using Sencha Ext JS 6.5 Modern Toolkit, we looked at the features common to data intensive applications and expectations from a UI framework. We mapped these features to Ext JS 6.5 Modern Toolkit and built a data intensive application showing the use cases in action.
Here are some of the important questions and their answers that we discussed during the sessions (there were multiple sessions). We hope these will be helpful to the community.
Can I use my custom template for grid header?
No, this provision is not available. In case you have to do it, you will have to review the implementation of Ext.grid.grid.Column class and override it.
Since Virtual store is available, should I still be using Buffered store?
The Modern toolkit has support for Virtual store only. You can think of it as an improved version of Buffered store.
What is a space filling chart and where do I use it?
A Spacefilling chart offers a drawing area inside which anything can be drawn. It does not have coordinate systems like Cartesian or Polar charts and it fills the entire area of the chart. Some of the examples are Gauge Chart, Heatmap and Treemap. You shall use it to create custom charts like a periodic table.
How can I implement editing a grid row? Is there an built-in support available?
Yes, grideditable plugin can be used for editing a grid row. It shows an edge menu on the right hand side of the screen, with fields that have been marked editable. By default, the edge menu appears on double-tap but you can modify it to singletap or some other event. Also, you can customize the default editor.
I am using a store for my grid as well as chart. But, when I sort data on grid I do not want the chart to change. Is there a way to achieve this?
Yes, the Data Package offers chained stores, which are specifically used for filtering and sorting without affecting the source store. So, you can achieve your use case by configuring a chained store on the grid whose source store would be the one configured on the chart. This way sorting/filtering on the grid would be independent of the chart.
We do have binding concept in AngularJS. Is the Ext JS binding similar to that?
Yes, the binding concept in Ext JS is similar to that of Angular. However, both frameworks differ in the way they track view model changes and propagate them to the bound views.
Can I persist the state of my components if the user had applied certain filters/sorters?
Classic type State management has not been incorporated yet in the Modern toolkit. So, managing the state of a component in Modern toolkit is purely an application logic. You will have to have your own implementation, today.
Do we have a pop-up form for editing a grid record?
No. The grideditable plugin that the Modern toolkit offers shows an edge menu with form but not a pop-up form. To have a pop-up form, you will have to handle the event on grid and use Dialog component to show a pop-up form panel and load it with the selected grid record.
I hope that the webinar and this Q&A shall help you in creating data-intensive application using Sencha Ext JS 6.5 Modern toolkit.
Happy coding!
