This advanced example shows how to use ExtJS 5 MVVM architecture to bind the record selected in grid to form. The record is editable both in the grid and form and form buttons are enabled and disabled according to the record valid and dirty state.
- implements two-way binding of the selected record
- no listeners, the logic is implemented in viewmodel formulas
- grid store is bound to viewmodel
- grid and form title are bound to the selected record
- record can be edited both in grid and form
- changes are immediately reflected in all bound places
- buttons are enabled only if the record is dirty (and valid)
- uses schema and model validation
- uses font icons
The example can be directly used in any application that require grid/form binding. The concepts shown here can be helpful as a guide for any kind of binding implementation.
Example Files (relative to example root)
The example has been initially generated with
sencha generate app so the following list contains only added or edited files:
Source CodeIf you want to see the example code, login or sign-up. Free membership is available.