In this Ext JS 6 Tutorial, you will learn how to edit data with an Ext JS 6 Grid and a PHP backend. You will create a sample Ext JS project with an Ext JS Grid that renders model cars data sent by a PHP page.
We will divide the tutorial in two parts:
- Part 1, which is this article, explains how to edit existing records in an Ext JS Grid.
- Part 2, which will follow this article, explains how to add new records and delete records from the Ext JS Grid.
As depicted in the screenshot, a user can modify a model car’s name, vendor and category through the Ext JS Grid. While we will let the user enter free text for the Name and Category fields, for the Vendor field we will provide a ComboBox with a list of vendor names. This requires a special setup for the Ext JS Grid and its Controller, which we will explore in a few minutes.