24 Jul 2013 6:31 PM #1
A grid column rendering as radio buttons, allowing the user to select one row per group.
Ext.ux.RadioColumn extends from Ext.column.grid.CheckColumn, so usage is similar. The difference is that checkboxes are lonesome animals, while radio buttons are eusocial.
Use the `groupField` option to define groups and make them happy. If `groupField` is already set at the store level (because you're using a grouping grid, for example), you won't need to repeat it in the column component.
Tested working with Ext 4.2.0
Tested not working with Ext 4.2.1. The row index is not detected correctly in the checkchange events, with grid grouping, when some groups are collapsed... This is an issue with Ext itself, resulting in erratic behaviour when grid groups are collapsed.
Code updated: minor fixes and performance tweaks.
See it in action:
Last edited by rixo; 28 Jul 2013 at 9:32 AM. Reason: Code updated, and added version information
25 Jul 2013 5:21 AM #2
Nice work. One area that might be a place for potential optimization is the use of the each() method to reset all of the field values in the unchecked records to false. The each() method does make the code concise and is easy to implement, however, if the data store or the number of groups is large, this could pose a potential drag in setting the unchecked records since the each() method will execute a function for every record. Using a vanilla "for" loop will be faster and since this is a reusable component, optimal performance will probably be a big benefit for its future use.
28 Jul 2013 9:40 AM #3
13 Aug 2013 11:13 PM #4
Thanks a bunch for this, I've been looking for something like radiocolumn