1. #1
    Sencha Premium Member
    Join Date
    Mar 2008
    Posts
    92
    Vote Rating
    1
    kveeiv is on a distinguished road

      1  

    Default Ext.ux.form.field.BoxSelect (now w/ 4.1 support!) - Intuitive Multi-Select ComboBox

    Ext.ux.form.field.BoxSelect (now w/ 4.1 support!) - Intuitive Multi-Select ComboBox


    BoxSelect for ExtJS 4.1 - Inspired by the infamous SuperBoxSelect for ExtJS 3 and BoxSelect for ExtJS 2

    Latest Release: v2.0.3
    View examples page: http://kveeiv.github.com/extjs-boxse...boxselect.html
    Download current release (2.0.3): https://github.com/downloads/kveeiv/...lect-2.0.3.zip

    BoxSelect is a ComboBox extended for more intuitive multiSelect capabilities. Features include:
    • Now supports ExtJS 4.1! Unfortunately due to changes in the framework rendering and layout, previous versions are not supported.
    • Individually removable labelled items for each selected value
    • Customizable item templates, in addition to ComboBox's support of customizable drop list templates
    • Keyboard-based selection and navigation of selected values (left/right, shift, ctrl-a, backspace, delete)
    • On-demand loading of values from remote stores when an unknown value is set and queryMode = 'remote' and forceSelection = true
    • Creation of new value records for forceSelection false
    • Configurable pinning of combo pick list for multiSelect = true
    • Configurable rendering of labelled items (auto-sized or stacked)
    • As BoxSelect extends ComboBox, most (if not all) of the functionality and configuration options of ComboBox should work as expected
    • Lots more!
    Any contributions of testing, improvements or other constructive feedback are greatly appreciated. I intend to actively maintain the development of this extension through the life of ExtJS 4, and will be able to best do so with the support of the community. Many thanks go out to everyone that has contributed already, and to those that will do so in the future.

    Now on github!
    Main github project page: https://github.com/kveeiv/extjs-boxselect
    To directly collaborate, please fork from the master branch and send pull requests when your proposal is ready. See the github help pages for more information. Contributions are also accepted through this thread or through private message here on these forums.

    [Changelog for 2.0.3]
    v2.0.3 - 24 Jul 2012
    Bug Fixes:
    * Resolved field layout issues in complex container layouts
    * Resolved destruction order to prevent javascript errors from sometimes occurring
    Documentation
    * Added button control to examples to show component configurations inline


    [Previous Updates]
    For a complete historical list of changes for all versions, please see CHANGELOG.txt in the download package.
    Last edited by kveeiv; 24 Jul 2012 at 2:50 PM. Reason: Release of version 2.0.3

  2. #2
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    627
    Vote Rating
    10
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default


    Problems I've encountered thus far:

    * If the emptyText is longer than about 20 chars, it gets cut off.
    * The emptyText is still displayed even once items are selected.
    * Clicking on the X to remove an item generates this error:
    Code:
    store.snapshot is undefined
    http://.../Ext.ux.BoxSelect.js
    Line 326

  3. #3
    Sencha Premium Member
    Join Date
    Mar 2008
    Posts
    92
    Vote Rating
    1
    kveeiv is on a distinguished road

      0  

    Default


    Thanks zombeerose. I've uploaded a new version with a fix for the following:

    Quote Originally Posted by zombeerose View Post
    * Clicking on the X to remove an item generates this error:
    I am headed out for the long weekend, but will address the other issues you mentioned related to emptyText (and sizing of the user input field inside the list container in general) next week.

  4. #4
    Sencha User
    Join Date
    Mar 2007
    Posts
    464
    Vote Rating
    1
    JorisA is on a distinguished road

      0  

    Default


    Awesome job! Will definitely try and see if I run into bugs!

  5. #5
    Sencha Premium Member
    Join Date
    Mar 2008
    Posts
    92
    Vote Rating
    1
    kveeiv is on a distinguished road

      0  

    Default


    Quote Originally Posted by zombeerose View Post
    * If the emptyText is longer than about 20 chars, it gets cut off.
    * The emptyText is still displayed even once items are selected.
    I've uploaded a new version to the main post (0.3) which fixes a variety of issues related to emptyText and also the sizing of the input field within the list element. Thanks for the reports!

  6. #6
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    627
    Vote Rating
    10
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default


    Thanks for the updates.

  7. #7
    Sencha User salarmehr's Avatar
    Join Date
    Mar 2010
    Location
    Tehran
    Posts
    45
    Vote Rating
    1
    salarmehr is on a distinguished road

      0  

    Default Thanks a lot

    Thanks a lot


    How can I remove an item from drop-down menu when user select that items?
    (as SuperBox do).
    Thanks

  8. #8
    Sencha User
    Join Date
    Mar 2007
    Posts
    464
    Vote Rating
    1
    JorisA is on a distinguished road

      0  

    Default


    I made some modifications to the CSS, only checked with chrome though, if you like it feel free to include them in "the official" release.

    Zip: Attachment 26436

    Before: (Attachment 26434)


    After: (Attachment 26435)

  9. #9
    Sencha Premium Member
    Join Date
    Mar 2008
    Posts
    92
    Vote Rating
    1
    kveeiv is on a distinguished road

      0  

    Default


    Quote Originally Posted by JorisA View Post
    I made some modifications to the CSS, only checked with chrome though, if you like it feel free to include them in "the official" release.
    Thanks for the contribution, but the links for the attachments you posted don't seem to be working. Can you check them and repost?

  10. #10
    Sencha User
    Join Date
    Mar 2007
    Posts
    464
    Vote Rating
    1
    JorisA is on a distinguished road

      0  

    Default


    damm you attachments!

    retry!
    Attached Files

Thread Participants: 94

  1. scottw (1 Post)
  2. mysticav (2 Posts)
  3. JorisA (5 Posts)
  4. bobmanc (2 Posts)
  5. notjoshing (4 Posts)
  6. grgur (1 Post)
  7. ValterBorges (2 Posts)
  8. WebProgrammer (1 Post)
  9. Schlurcher (1 Post)
  10. zacware (2 Posts)
  11. ngd (8 Posts)
  12. radtad (2 Posts)
  13. zombeerose (13 Posts)
  14. nicholasnet (1 Post)
  15. themightychris (2 Posts)
  16. abraxxa (8 Posts)
  17. ttbgwt (1 Post)
  18. Psychokrameur (2 Posts)
  19. commanche (1 Post)
  20. ernst96 (2 Posts)
  21. omarc (1 Post)
  22. qooleot (1 Post)
  23. foxmarco (1 Post)
  24. christophe.geiser (1 Post)
  25. wki01 (1 Post)
  26. purnama (1 Post)
  27. mediacept (1 Post)
  28. bareflix (2 Posts)
  29. User 0815 (1 Post)
  30. yuuzai (1 Post)
  31. talha06 (1 Post)
  32. xjpmauricio (1 Post)
  33. scishop (2 Posts)
  34. Smalltalker (1 Post)
  35. hazimdikenli (2 Posts)
  36. raz0r1 (1 Post)
  37. McQuack_82 (1 Post)
  38. elilindner (1 Post)
  39. hexawing (1 Post)
  40. maneljn (3 Posts)
  41. Tim Toady (2 Posts)
  42. alonweiss (1 Post)
  43. ubong (1 Post)
  44. salarmehr (5 Posts)
  45. koblass (1 Post)
  46. Karthikeyan.rajmohan (2 Posts)
  47. Reimius (1 Post)
  48. CSC-Germany (1 Post)
  49. sankarbaluz (2 Posts)
  50. alaley (2 Posts)
  51. navvn (2 Posts)
  52. danCTS (2 Posts)
  53. bentoo42 (1 Post)
  54. jmaia (2 Posts)
  55. maslofer (1 Post)
  56. cadror (3 Posts)
  57. mrinsan (1 Post)
  58. yumaa (1 Post)
  59. rsqw (2 Posts)
  60. mahesh21688 (3 Posts)
  61. derditze (3 Posts)
  62. kunalshah6363 (1 Post)
  63. NatVik (1 Post)
  64. softwareguy (1 Post)
  65. alicexyl (7 Posts)
  66. under_dog (1 Post)
  67. tommytob (2 Posts)
  68. charlie17 (5 Posts)
  69. nathanrice (1 Post)
  70. srarnold (3 Posts)
  71. ettavolt (1 Post)
  72. qnens (1 Post)
  73. nikadod (3 Posts)
  74. PanchiKB (1 Post)
  75. Hooped (1 Post)
  76. dedoz (3 Posts)
  77. metas (1 Post)
  78. lindemann-medien (2 Posts)
  79. nathanmelis (1 Post)
  80. cyborat (1 Post)
  81. Forn (1 Post)
  82. gaurav.rehan (1 Post)
  83. Avman2119 (3 Posts)
  84. zzhouag (5 Posts)
  85. andreas-spindler (3 Posts)
  86. Alvaro L (1 Post)
  87. hown (1 Post)
  88. edson.hh (2 Posts)
  89. QuantumScripting (1 Post)
  90. chungns (1 Post)
  91. Delphine (1 Post)
  92. folivieri (1 Post)
  93. Lpsmash (1 Post)
  94. thinkman (1 Post)

Tags for this Thread