Is it possible to create multilevel combobox using ExtJS 4.0? I mean, that it should have, for example, these options:
This
Month
Year
Last
Month
Year
This and Last options should be not selectable.
This absolutely is possible.
You can define a template for your combobox which defines how the row is displayed. What you can do is have the store have a field which defines the type of record, such as a boolean header field.
In your xTemplate which you pass into the Combobox's tpl config, you can check the value of that field and if it's a header apply separate styling. Then, add a beforeselect listener and if the record's header field is true, return false.
I saw something similar on the Ext website, but can't locate it right now. If you need more details, let me know.
Related
I have a grid with 3 columns and 5 rows.
I have attached a CellEditing plugin to the grid.
And for the 3rd column i have defined an numberfield editior.
So now due to this each row 3rd column has a numberfield editor attached to it.
But due to some condition present in data/column metadata, i want to disable the numberfield editor for 2nd and 4th row.
I am unable to disable cell editor for particular rows as the editor is attached at the column level.
Is there a way in ExtJS to handle this kind of scenario.
I am using ExtJS 5.
As noted in the comments by Evan, you need to use the beforeedit event to veto the edit before it starts.
ExtJS does not attach an editor to every cell. Instead, when the user triggers the edit (e.g. by single- or double-clicking on the grid cell), the CellEditing plugin will be invoked. If the beforeedit event is not vetoed, it will then attach the edit field to the cell in place. When the edit is finished, the edit field will be detached.
If you want to style the non-editable fields differently, to help indicate that they are not editable, the column can be assigned a renderer, which will allow you to provide cell-specific attributes, including CSS style.
Does the fuelux datagrid support adding additional filter options? I would like - for instance - to add (next to the filter dropdown you already have in place), a checkbox which should also be added as a parameter to my function that retrieves the data remotely from the server.
It would be nice if the grid would automatically take any parameters from input elements that we can mark by adding a specific class or data- attribute.
Thanks very much! :)
David.
You can absolutely do this.
Add filtering logic to the datasource you provide, keyed off any custom property you add to the datasource.
Add the checkbox within the datagrid markup (or anywhere).
When your checkbox is clicked, update the custom property on your datasource and then call $('#MyGrid').datagrid('reload') to tell the datagrid to reread your datasource
I have a requirement to create a custom form field that is basically an extjs grid. The user should be able to click a result in the grid. This clicked result should then become the fields value. Also, this field needs to extend Ext.form.field. Here's what I got:
Ext.define('MyApp.field.Grid', {
alias: 'widget.GriedField',
extend: 'Ext.form.field.Base',
I'm a lot of confused on how to add a grid to form field base. Looks like form field base's template expects HTML. How do I get it accept a component?
If you just need to select a value from a list of items. Why not use a combobox?
If you need to select multiple items. There is an example of how to use the MultiSelect ux component in the documentation examples.
http://docs.sencha.com/ext-js/4-1/#!/example/multiselect/multiselect-demo.html
If you really must use a grid. Then I wouldn't bother with trying to create a field type and cause yourself grief.
Add a listener to your grids selectionchange event and update a hidden field in your form with the value you want from the grid. Job done.
I ended up putting the grid on a form indirectly through creation of dependencies on my model.
My model has master-detail, which the detail is just a store reference. I found that using associations did not work for me.
So, in adding a field to a form, I have something that manages changed events for the model (master record) and the detail stores.
I have an Ext.grid.EditorGriPanel which has an combobox editor in its columnModel (the store of combox has just only 2 items: enabled/disabled). When a new blank row is inserted to grid, I want the combobox in that column have to be set to a default value (enabled), and the dropdown is not expanded.
I've tried to use
grid.colModel.columns[2].editor.select(0)
to get the combobox editor and set "enabled" value for it, but it did not work. Another way is using grid.colModel.columns[2].getCellEditor(rowIndex), but it returns an EditorGrid (I was so surprised because the ExtJS 3.3.1 API doesn't have this component).
Could you please help me on this problem?
Thank you so much!
When a new blank row is inserted to
grid, I want the combobox in that
column have to be set to a default
value (enabled), and the dropdown is
not expanded.
When the new record is inserted to the grid's store, the value of your column (in the record) needs to be set to "enabled". I'm not sure if you are doing it like this currently? In other words, the value must not be set to the editor of the column. Set it directly in the record.
(Also, you can define default values to be used for all records using the recordType property of the store - see ExtJS API documentation for more details - but this is optional.)
Finally, note that the combobox will not be displayed immediately after the row is added. The combobox is displayed only when you start editing that particular cell - this is the way EditorGrid works in ExtJS. But at least you should get the new row to immediately display the correct value ("enabled") with this advice.
I m new to ExtJs. I was wondering if there's some way wherein i can display multi-line combo-box in ExtJS in a way that for eg : when i select one item, that item may contain 2 values i.e ID and Name., and both the items are considered as one selection, and not with Ctrl+Select way.
Sure there is. Look at the tpl config option of ExtJS ComboBox. You can define a custom template where you may utilize any fields from the Store of the ComboBox as you wish. (See the example included for the tpl config option from ExtJS API documentation that I linked.)