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".
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);
There are a couple of approaches you can take here:
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.
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
Related
I use AgGrid Enterprise, and allow users to edit an entire row so all cells switch to edit mode.
I also have an event listener to save the row in database when the user put the focus on a new line or outside the grid.
In the first column of my grid, i have a custom cell displaying a combo.
When the user select a value, it should update the cell AND 3 other cells in the row.
So i use the API to refresh the 3 cells.
Doing so put the cell in view mode, i loose the edit mode and the save event is triggered.
Is there a way in edit mode, to update cell content without loosing the edit mode ??
Thanks a lot.
You said your are try to entire row and and also have custom cell with combo
but ag-grid does not work any popup editor with full row edit.
You have to remove ag-grid property editType: 'fullRow' and it will work.
https://www.ag-grid.com/javascript-grid-cell-editing/#gsc.tab=0
How to dynamically update summary feature for grid in extjs4.1?
In my application the grid summary will become filled at the time of loading the page, the grid by calculating a total using the summary feature. I have a combo box drop down in the screen. If a user selects from the combo box, I need to update the grid records from store and also need to update the calculated summary value using records coming from another store.
Can anybody tell me how to do that? Thanks
Assuming that yourGridItemId is the first/only grid with this itemId, the following code should work:
Ext.ComponentQuery.query('#yourGridItemId')[0].getView().refresh();
I am designing an extjs application where I have couple of panels. and one of them of has a grid. I know I can either do selectionChange on the grid listener or itemClick.
Which one should I use? Or moreover which one is better. I obviously load data on the right panel once the grid item is clicked
The first one get fired only when the selection changes (as you might has guessed) and give you a array of selected record (which might be just one) while the second one get called for each click and give you only the one record you clicked on.
For your case I would tend to use the second event and save the last last clicked record internally. I would then only load the second grid if it was not already loaded for this record.
your grid is displayed as table on page at runtime so you can add onClick() event on grid or table cell during onrowdatabount event of grid.
I'm developping with extjs4.
I have two grids as shown in the image, I want when I click on the line of Grid Panel 1 that contanis Number 1, the Grid Panel 2 will show only lines that contains Number 1.
That is pretty much straightforward; subscribe to the select event of the first grid and within that handler filter the store of the second grid. That's it.
grid1.on('select', function(grid,record) {
grid2.store.clearFilter(true); // see http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.Store-method-clearFilter
grid2.store.filter('Number', record.get('Number');
},this);
I have a silverlight DataGrid, by default on page load the all the cells of the datagrid should be Readonly. I have 2 problem , can any one help me?
1.On Click on the RowHeader the current row should be editable
2. On click of the columnHearder current column of all row should be editable
This might not solve your entire problem but it should partially address it.
This is to make a column read-only in a datagrid
DataGrid.Columns[7].IsReadOnly = true;
Obviously the property can be changed from events but the data grid does not have row/column headers event handlers. Custom controls seem the way to go without introducing any new gui elements like buttons and changing the feel of the application.