29 Nov 2007 1:46 PM #1
[2.x] Ext.ux.MultiSelectTextField (outlook/gmail style 'to' field)
Like in outlook (or gmail) where you can just type into an input field to select multiple items. The value for each item isn't what is displayed, just like a normal multi select box, for example in the screenie below it has a values of "VA", "MI" and "DE".
We're using this in an app so that users can type in the names/emails/etc of people to send items to, but the value of the fields is the user IDs.
I've only tried it with a local store setup as in the demo, but seems to work well on FF, IE6, IE7 and Safari.
30/11/2007 - v0.0.3 - fixed bug where multiple fields didn't initialize data properly
30/11/2007 - v0.0.2 - added validation, fixed bug deleting items
29/11/2007 - v0.0.1 - initial version
Bugs reports and Suggestions are very welcome! Cheers.
Source on GitHub
Last edited by RLivsey; 24 Jun 2008 at 1:01 AM. Reason: updated to v0.0.3
29 Nov 2007 2:33 PM #2
29 Nov 2007 2:35 PM #3
One bug: If I select various entries and manually (By keyboard) go to intermediate comma and delete it, I have a error.
Thanks in advance,
29 Nov 2007 4:50 PM #4
Ah good catch, I'll have a go at fixing this up in the am, shouldn't be too difficult!
29 Nov 2007 9:57 PM #5
I post field that was used 'hiddenName',but data shows displayField not valueField
30 Nov 2007 1:38 AM #6
Very nice. I haven't taken a peek at the code yet, but here's my initial suggestions based on playing with the demo.
- It would be good if when you clicked anywhere within one of the list items, it selected that list item for easy deletion
- backspacing all the way to an empty field leaves a "dropdown" of the single item in the store that most closely matched the last character to be removed by pressing the backspace key
- the field out to offer in its config the ability to toggle whether or not duplicates are permitted. if not, values that have already been selected should be filtered from the store.
Ext JS - Support Team Volunteer
Any and all code samples that are authored by me and posted on the Ext forums or website are hereby released into the public domain and I release anyone or entity of liability by using said code samples unless explicitly stated otherwise.
Opinions are mine and not necessarily endorsed by Ext, LLC. Please do not contact me directly for assistance unless requested by me.
30 Nov 2007 4:52 AM #7
30 Nov 2007 4:55 AM #8
You can click delete anywhere within an item to delete it, but I agree it could be nice to auto select it so it's more obvious.
Will look into the backspacing issue.
At the moment, it doesn't allow duplicates, I'll need to change a few things about how it works to be able to enable that but defo possible.
I need to add validation to check for the number of items - IE minimum/maximum/exact number of items. I'm adding that in this afternoon.
30 Nov 2007 5:51 AM #9
kudos to you! Excellent job. A nice application for this would be if an app supports tagging ala Del.icio.us
30 Nov 2007 6:17 AM #10
WOW!!! Great Widget! Very good work!Extensions:
Ext.ux.menu.StoreMenu - Ajax Store as menu-item config
Extended Window - Aero Shadows, nested grayscaled modal windows
Ext.ux.plugin.triggerfieldTooltip (for Comboboxes, Datefields...)
Thread Participants: 30
- JeffHowden (2 Posts)
- TommyMaintz (1 Post)
- galdaka (2 Posts)
- dawesi (1 Post)
- jimmyphp (1 Post)
- sfwalter (1 Post)
- Hani (1 Post)
- DigitalSkyline (1 Post)
- apaa (2 Posts)
- symfony (1 Post)
- xwisdom (1 Post)
- cmendez21 (5 Posts)
- fsakalos (1 Post)
- krycek (1 Post)
- george.antoniadis (1 Post)
- Zyclops (3 Posts)
- Bharani (1 Post)
- gelleneu (1 Post)
- ThorstenSuckow (1 Post)
- jerrybrown5 (2 Posts)
- wm003 (2 Posts)
- fidorkozrout (1 Post)
- msuresh (1 Post)
- kmoore (2 Posts)
- zilionis (1 Post)
- ext_fan (2 Posts)
- Scorpie (1 Post)
- mfiandesio (1 Post)
- thrillhouse (2 Posts)
- cool.akshay (1 Post)