In EXT, click the button grid to add an instance code line (you can set the cursor position). extgrid

In EXT, click the button grid to add an instance code line (you can set the cursor position). extgrid

Let's talk about ext.

Ext is a powerful js class library, previously based on YAHOO-UI, And now completely independent, mainly including data, widgets, form, grid, dd, menu, the most powerful one is grid. The programming idea is based on object-oriented Programming (oop), and the scalability is quite good. you can write extensions by yourself. customize the namespace. web applications may feel too big. however, you can load the class library as needed.

The main package contains three large files ext-all.css, ext-base.js, ext-all.js (including all the class libraries, you can delete as needed. this interface is provided on the official website) When you reference the ext class library. these three files are essential.

It provides a rich and beautiful appearance experience, and has become a popular choice for many interface layer developers! Its core components basically cover the common components used to build rich clients.

Starting with Ext 2, the commercial version (for profitable developers) will be charged.
This may affect some of his application prospects. The latest version is 3.2.2.

1. Create an Add button. In the listeners event, click the button event,

{Id: 'button1', xtype: 'button ', margin: '6', text: 'add', name: 'btn-add', iconCls: 'btn-add', listeners: {click: function () {var r = Ext. create ('itemgridmdl ',{//............}); // The data Ext. getCmp ('grid1 '). getStore (). insert (Ext. getCmp ('grid1 '). getStore (). getCount (), r); // Add a cellEditing row at the end of the table. cancelEdit (); cellEditing. startEditByPosition ({// the position where the cursor appears in the table to be edited row: Ext. getCmp ('grid1 '). getStore (). getCount ()-1, column: 1 });}}}

2. Call the button Method

Ext.getCmp('fbutton').fireEvent('click');

3. plugins: attribute configuration in the grid table:

plugins:[cellEditing=Ext.create('Ext.grid.plugin.CellEditing', {clicksToEdit:1,listeners: {edit: function(editor,e) {}}})],