PageRenderTime 52ms CodeModel.GetById 24ms RepoModel.GetById 0ms app.codeStats 0ms

/README.md

https://github.com/lightyear/protomultiselect
Markdown | 150 lines | 131 code | 19 blank | 0 comment | 0 complexity | 688e132d26b29f715d0883ccd805cdd0 MD5 | raw file
  1. # Proto!MultiSelect
  2. Prototype version required: 1.6.0 (1.6.1 for IE8)
  3. Copyright: InteRiders <http://interiders.com/> - Distributed under MIT - Keep this message!
  4. ## Credits
  5. - Idea: Facebook + Apple Mail
  6. - Caret position method: Diego Perini <http://javascript.nwbox.com/cursor_position/cursor.js>
  7. - Guillermo Rauch: Original MooTools script
  8. - Ran Grushkowsky/InteRiders Inc. <http://interiders.com/>
  9. - Loren Johnson, <http://www.hellovenado.com/>
  10. - Zuriel Barron, <http://severelimitation.com/>
  11. - Sean Cribbs <http://seancribbs.com/>
  12. - [skaue]
  13. - Nickolas Daskalou <http://www.footysx.com.au/>
  14. - Chris Anderton <http://thewebfellas.com/>
  15. - Dejan Strbac
  16. - Daniel Vandersluis <http://www.codexed.com/>
  17. ## Parameters (and defaults)
  18. - separator: ','
  19. - extrainputs: true
  20. - startinput: true
  21. - hideempty: true
  22. - newValues: false
  23. - allow new values to be created
  24. - newValueDelimiters: ['[',']']
  25. - define what values split into new entries
  26. - spaceReplace: ''
  27. - allow handling of new tag values when the tagging scheme doesn't allow spaces, this is set as blank by default and will have no impact
  28. - fetchFile: undefined,
  29. - location of JSON file
  30. - fetchMethod: 'get'
  31. - set HTTP method
  32. - feed: undefined
  33. - initial JSON feed to use (ignored if fetfile is specified)
  34. - results: 10,
  35. - maximum number of results to retrieve for display in the list (see also maxResults)
  36. - maxResults: 0
  37. - number of results to show in the list before scrolling - when set to 0 then it uses the default of 10 (i.e. there is no 'zero' option)
  38. - wordMatch: false
  39. - when set to true will match only the beginning of word (only when using regex search), otherwise will match anywhere
  40. - onEmptyInput: function(input){}
  41. - callback that is called when user hits enter when the input is blank
  42. - caseSensitive: false
  43. - case sensitive/insensitive matching
  44. - regexSearch: true
  45. - specifies whether to search using a regular expression or simple text search (faster)
  46. - onAdd: function( input ){}
  47. - callback that is called when a new element is added to input. Argument is an object containing caption and value members. If it's a newvalue, caption will be nil.
  48. - onRemove: function( value ){}
  49. - callback that is called when a element is removed from the input. Argument is the value of the element.
  50. - loadFromInput: true
  51. - specifies whether to add any values given in the initial text input to the control. Values will be loaded against any data provide
  52. - defaultMessage: ""
  53. - if the control is building the autocomplete div itself, specifies the default message to use.
  54. - sortResults: false
  55. - specifies whether autocomplete results should be sorted alphabetically by caption.
  56. - autoDelay: 250
  57. - specifies the delay before the autocomplete results appear.
  58. - encodeEntities: false
  59. - specifies whether HTML entities should be encoded when inserted. Braces are always converted into HTML entities regardless of this setting.
  60. - allowComma: false
  61. - specifies if a comma should separate entered values or if a single value can include a comma. If you enable this, you should also specify separator so that you don't end up with ambiguous data while processing on the server.
  62. ## Changelog
  63. ### 0.1
  64. - translation of MooTools script
  65. ### 0.2
  66. - renamed from Proto!TextboxList to Proto!MultiSelect, added new features/bug fixes
  67. - added feature: support to fetch list on-the-fly using AJAX Credit: Cheeseroll
  68. - added feature: support for value/caption
  69. - added feature: maximum results to display, when greater displays a scrollbar Credit: Marcel
  70. - added feature: filter by the beginning of word only or everywhere in the word Credit: Kiliman
  71. - added feature: shows hand cursor when going over options
  72. - bug fix: the click event stopped working
  73. - bug fix: the cursor does not 'travel' when going up/down the list Credit: Marcel
  74. ### 0.3
  75. - bug fix: moved class variables into initialize so they happen per instance. This allows multiple controls per page
  76. - bug fix: added id_base attribute so that multiple controls on the same page have unique list item ids (won't work otherwise)
  77. - feature: Added newValues option and logic to allow new values to be created when ended with a comma (tag selector use case)
  78. - mod: removed ajax fetch file happening on every search and moved it to initialization to laod all results immediately and not keep polling
  79. - mod: added "fetchMethod" option so I could better accomodate my RESTful ways and set a "get" for retrieving
  80. - mod: added this.update to the add and dispose methods to keep the target input box values always up to date
  81. - mod: moved ResizableTextBox, TextBoxList and FaceBookList all into same file
  82. - mod: added extra line breaks and fixed-up some indentation for readability
  83. - mod: spaceReplace option added to allow handling of new tag values when the tagging scheme doesn't allow spaces, this is set as blank by default and will have no impact
  84. ### 0.4
  85. - bug fix: fixed bug where it was not loading initial list values
  86. - bug fix: new values are not added into the autocomplete list upon removal
  87. - bug fix: improved browser compatibility (Safari, IE)
  88. ### 0.5
  89. - Add search timeout to increase responsiveness to typing.
  90. - Add non-standard autocomplete attribute to main input to prevent browser-supplied autocompletion in Gecko and some other browsers.
  91. - bug when gsub'ing space wth "spaceReplace". Input-field does not have a function gsub, though its value has.
  92. ### 0.6
  93. - Update with changes by Nickolas Daskalou
  94. - Option to specify whether to perform a case sensitive search or not (option: "caseSensitive", default: false).
  95. - Option to specify whether you want the search to be performed by regular expression or by simple text search (option: "regexSearch", default: true). Non-regular expression searching is MUCH faster than by regular expression (this is the way the real Facebook autocomplete search works).
  96. - Option to specify a callback upon the user hitting Enter/Return when the input is blank (option: "onEmptyInput", default: function(){}). I needed this because I did not want the user to have to move their hand off the keyboard to the mouse and then click on the submit/action button.
  97. - Option to specify the maximum number of results to show (NOT the same as the "result" option, see comments below) (option: "maxResults", default: 10).
  98. - NOTE ON THE NON-REGULAR EXPRESSION SEARCH: If using non-regular expression search mode, the option "matchWord" WILL HAVE NO EFFECT on the results (ie., it will behave as if matchWord were set to false). This can be fixed but at 5am my pillow is looking too good to spend more time on this, so if anyone needs this feel free to email me a request and I'll get it done (nick at footysx.com.au).
  99. - NOTE ON THE MAXRESULTS OPTION: The difference between the options "results" and "maxResults" is that "results" specifies the maximum number of visible rows allowed to be shown to the user before a scrollbar activates, whereas "maxResults" specifies the maximum number of results allowed to be in the scrollable list.
  100. ### 0.7
  101. - fixed non regex search
  102. - stable
  103. ### 0.8
  104. - a number of updates provided by Dejan Strbac
  105. - sanitizes characters so special characters don't break it
  106. - escapes html
  107. ### 0.8.1
  108. - small changes by Nathan Stitt
  109. - Added callbacks onAdd and onRemove for integration into existing projects
  110. - Renamed main class from FacebookList to MultiSelect. I don't like calling it Facebook becouse of trademark issues. Plus it's confusingly called that in the docs.
  111. - Went through file with Emacs JS2 mode and fixed errors identified, mostly missing commas and semicolons.
  112. - Ignore Emacs backup and OSX .DS_Store files
  113. - added new method insertCurrent, which will add whatever is currently in the input box as an element. Set enter to add elements along with comma.
  114. ### 0.9
  115. - Changes by Daniel Vandersluis
  116. - Added createAutohandler method to automatically create the needed div/ul elements so that they don't need to be created in the HTML.
  117. - Added loadFromInput option (default: true) to load values given in the initial text input into the control.
  118. - Added defaultMessage option (default: "") which is used for a default message div if the control creates the autohandler. The default message is no longer mandatory.
  119. - Added sortResults option (default: false) which will sort autocomplete results by caption.
  120. ### 0.10
  121. - Decoupled TextboxList from ProtoMultiSelect so that TextboxList is fully functional on its own.
  122. - Fixed ResizableTextbox so that it actually resizes the textbox and is much more intelligent about calculating the size.
  123. - Changed TextboxList to use div and a instead of ul and li so that events can be contained within the control instead of being registered on the document object.
  124. - Stopped the selected autocomplete result from being added if the input value does not match the result when enter is pressed.
  125. - Fixed Home and End key events so that they don't scroll the page when pressed within the control.
  126. - Added autoDelay option (default: 250) to specify the delay before the autocomplete results appear.
  127. ### 0.11
  128. - Fixed control not playing well with HTML and entities.
  129. - Added encodeEntities option (default: false) that will automatically encode HTML entities to their unicode characters if set.
  130. - Fixed < causing a new value to be inserted.
  131. - Pressing tab with the autocomplete open will now cause the selected value to be inserted (like enter).