JQueryTextboxList < System < Eugene Maker Space Wiki

You are here: Eugene Maker Space Wiki>System Web>JQueryPlugin>JQueryTextboxList (13 Dec 2010, ProjectContributor) (raw view)EditAttach

---+ %TOPIC%
%JQPLUGINS{"textboxlist"
  format="
    Homepage: $homepage <br />
    Author(s): $author <br />
    Version: $version
  "
}%

%STARTSECTION{"summary"}%
Turns a text input into a Facebook like list widget with autocompletion.
This plugin adds a new formfield type =textboxlist= to DataForms.
%ENDSECTION{"summary"}%

---++ Examples
%JQREQUIRE{"textboxlist"}%

---+++ Tagging
<form>
<div class="foswikiFormSteps">
  <div class="foswikiFormStep">
    <h3>Tags:</h3>
    <input type="text" class="foswikiInputField jqTextboxList" size="20" name="tags" value="%URLPARAM{"tags" multiple="on" separator=", " default="foo, bar, baz"}%" />
    <div class="foswikiGrayText">
       Type in some keywords
    </div>
  </div>
  <div class="foswikiFormStep">
    %BUTTON{"%MAKETEXT{"Submit"}%" icon="tick" type="submit"}%
    %CLEAR%
  </div>
</div>
</form>

---+++ Tagging with autocomplete suggestions

Note, that you will need Foswiki:Extensions.FilterPlugin to run the example successfully. 

<form>
<div class="foswikiFormSteps">
  <div class="foswikiFormStep">
    <h3>Tags:</h3>
    <input class="foswikiInputField jqTextboxList {autocomplete:'%SCRIPTURL{"view"}%/%WEB%/%TOPIC%?section=data;skin=text'}" id="example" size='42'  />
    <div class="foswikiFormDescription">
      Tags are suggested as you type.
    </div>
  </div>
</div>
</form>

---++ Backend Implementation
<verbatim class="tml">
%STARTSECTION{"data"}%%FORMATLIST{
  "admin,
   backup,
   bash,
   emulation,
   games,
   irc,
   linux,
   mercurial,
   patches,
   perl,
   php,
   python,
   site,
   surfing,
   tag,
   test,
   foswiki,
   web,
   wiki,
   windows,
   windsurfing,
   wine
  "
  split="\s*,\s*"
  format=" $1 "
  separator="$n"
  include="\s*%URLPARAM{"q"}%.*"
}%%ENDSECTION{"data"}%
</verbatim>

Topic revision: r1 - 13 Dec 2010 - 13:15:03 - ProjectContributor

System

Webs
Main
Sandbox
Sites
System

Copyright © by the contributing authors. All material on this site is the property of the contributing authors.
Ideas, requests, problems regarding Eugene Maker Space Wiki? Send feedback