View Full Version : Show TextBox Value in Grid

1 Mar 2012, 11:30 PM
hello all of you !
i am newbie in extjs , i want to show my textbox values in grid , i have experience of working in vb.net and c#.net of about 3 years. in both of them we have a property name rows.add , i want to perform same action , means i have 3 columns in grid , 3 textbox and a single button. i want that when i press button values of three texboxes inserted in grid .i dont want to save those records in database .
now i am using a array , and after inserting my textbox values in it i want it to populate my grid , but this logic is not working. so i came here to get help from the people those are good in extjs.:)
please if possible post some code for this prob.:s

Best Regards

M.Waqas Aslam

1 Mar 2012, 11:42 PM
Let have a try with Ext.grid.plugin.RowEditing (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.grid.plugin.RowEditing).

1 Mar 2012, 11:47 PM
If you want to enable direct entry into the grid (e.g. by double clicking a row), use the rowEditing plugin on the grid as suggested above. If you dont want that, you need to attach a store with the grid having the fields you want to display. then you can load your data into this store and it will be displayed in the grid.


check out the documentation of store and grid and see some examples.

1 Mar 2012, 11:59 PM
hello !
thanks both of you for quick response , well i search so many examples in documentation given by the site. you are right i want to show textfields value in grid by clicking a button. can you please explain it little more .

Best Regards[/FONT]

2 Mar 2012, 12:08 AM
you can define a store like this:

var store = new Ext.data.Store({
storeId: 'store',
{varname: 'value1', type: 'long'},
{varname: 'value2', type: 'string'}

then you get the values from your textfields and create an array e.g.

var array = [{value1:20, value2:"helloWorld"}];

In your grid, you can use this store in the store config and you will see the values. you can call store.loadData on the click event of the button. This would create one row in the grid having 2 columns. If you want more than 2 rows, you have to fill your array with more records separated by a comma.