Simulate a click event on a grid row

Question

How can I dynamically click rows in my grid?

E.g.: I am using border layout. I have a grid in the west with a list of Companies. When I click on a Company, the information of the company which has an Id, is displayed in a form in my center area.

Now, when I want to add a company ( I am doing this with a button which opens a "Add window"), and type all information in the form and then press "save", I reload the grid. How could I make it, that the company which is newly added, is clicked on and its information is displayed in the center area.

NOTE: The companies are listed with an ajax request, and the information is called with a "onCompanyGridHandler".

Answer 1

You can make the new campany created added in the top of the grid by sorting the grid's store with, for example, the date of campany creation. You can so add this line in the grid's store:

sorters: { property: 'datecreate', direction : 'DESC' },

Then, after the campany creation, you select the first row of the grid, using this code:

Ext.getCmp('your_grid_id').getView().select(0);

Answer 2

There are a couple of approaches you can take here:

1. In the function where you add the data from the Add Window to the grid panel's store, you can also get the form and use the form's loadData() method to load the data into the form, populating both the Grid and Form at the same time.

2. As is mentioned in a comment, after adding the data to the grid's store, make fire the click event on the row in the grid that is displaying the new data. I prefer the first approach because you do not have to find the correct row in the grid and fire its click event. In the first approach both the grid and form are loaded with the data directly.

David