I have generated grid panel based on my results in PHP. Here is a grid panel: myGridPanel.
Now I need to create third row in grid panel and place Ext.form.ComboBox inside this third row. There should be a Ext.form.ComboBox for every column.
NB! Not one combobox, but a number of them for every column, but only in third row.
I thought about applying editor to this grid panel columns like here, but as you can see this means, that all rows will have Ext.form.ComboBox, but I need them only in third row. Third row shouldn't have any content except those Ext.form.ComboBox with their data.
I think you should add a renderer for that column (in ColumnModel) and try to give the column value (which can probably be everything) depending on which line you are rendering. E.g.:
function renderTestColumn(value, p, record, store) {
return value;
}
Here you can find all params passed to renderer function:
http://dev.sencha.com/deploy/dev/docs/source/ColumnModel.html#method-Ext.grid.ColumnModel-setRenderer
I solved the problem by adding a PropertyGrid to the layout. So now it's
Parent - layout : 'border'
| - 'center' : GridPanel
| - 'east' : PropertyGrid
Now I have same ComboBoxes in this property grid and parent is xtype : 'form'. So now sending setup data from suggestions about GridPanel which were set in PropertyGrid is not a problem.
Adding separate row to GridPanel is to difficult for me yet.
Related
I have two grids with the same columns. I want to add records from grid 1 to grid 2 and I want to allow duplicates in the second grid. I know stores have an id property to not allow duplicates. I override this using idProperty: 'customId' config in the model. I'm using an autoincremental customId field as the new idProperty. But this doesn't work: I click twice or more times at the select column but nothing happens (it only works the first one). How can I solve this?
I did a fiddle with the example.
when you are adding record to destination Grid's store, instead of adding record, use record.data property to pass pure data object, not a model object.
destinationGrid.getStore().add(record.data);
here is fiddle
In the angular ui grid i have too many columns to display.
Want to display extra columns as expand collapse under each row.
Which means expand/collapse button will be provided for each row and while exanding a particular row the extra columns headertemplate will b displayed along wil b displayed along with column values.
Is it poasible with angular ui grid
As far as , there is no an option for that.
You can use the following to make things work as you wish:
remove default row headers by setting to false enableExpandableRowHeader
adding a custom row header by calling $scope.gridApi.core.addRowHeaderColumn
For reference :
http://ui-grid.info/docs/#/tutorial/114_row_header.
http://ui-grid.info/docs/#/tutorial/216_expandable_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 column to display db ids and I would like this column to adjust its width automatically to the longest one. I have found a config option called shrinkWrap but I don't see any result on the screen.
There is a private function expandToFit which can be used on the container object of the grid header.
Try something like this on the Ext.grid.column.Column object after all the records are loaded in the grid, for instance on the event viewReady of the Ext.grid.Panel:
column.ownerCt.expandToFit(column);
Iterate through the columns and call the above statement per column you want to have expanded.
Try using the flex property like so:
{
text:"Ids",
dataIndex:'Ids',
flex:1
}
In extjs I have a GridPanel. The GridPanel has some hidden columns. Now when I click on the Grid menu, there is an option called 'Columns'. When you mouseover 'Columns' you can check/uncheck the columns you want to show/hide.
Be default the hidden columns are also showing up on mouseover. Is there a way to avoid this?
You can use such a property for your columns:
hideable:false
In this case these columns can not participate in showing/hiding.
from column def reference:
hidden : Boolean
Optional. true to initially hide this column. Defaults to false. A hidden column may be shown via the header row menu.
If a column is never to be shown, simply do not include this column in the Column Model at all.