Editable and Writable ExtJS Grid Example

Description

This is a quite complex example of editable grid that loads and sends data from and to the server where the data is saved in SQLite database. It is an MVC Ext application with model, store, view and controller implemented. To run the server code of the example locally you need to have Apache server with PHP installed and SQLite PHP extension enabled.
Open in new window

Main Features

  • feature complete
  • implements all CRUD operations (create, read, update, destroy)
  • dynamically enables/disables controls to prevent accidental user errors
  • contains paging toolbar with extra buttons
  • grid is remotely sortable
  • uses Font Icons
  • logger for learning purposes

Use Cases

The example is ready to be used in a real-life applications when an editable grid is needed.

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:
1
2
3
4
5
6
7
8
app.js
app.json
 
app/Application.js
app/model/CompanyModel.js
app/store/CompanyStore.js
app/view/MainGridView.js
app/controller/MainController

Source Code

If you want to see the example code, login or sign-up. Free membership is available.
  • Author
  • Recent Posts
Follow me:
saki
I'm a well seasoned developer, consultant and educator of web applications based mainly on Sencha libraries, PHP, MySQL and Node.js. Besides (Apple) computers, I love photography and mountain biking.
Follow me:
Latest posts by saki (see all)
  • Ext, Angular, React, and Vue - June 27, 2019
  • The Site Resurgence - February 11, 2018
  • Configuring ViewModel Hierarchy - June 19, 2015