diff --git a/src/demos.erl b/src/demos.erl
index d134987..dff4241 100644
--- a/src/demos.erl
+++ b/src/demos.erl
@@ -52,6 +52,7 @@ middle() ->
         #link { text="Validation", url="/demos/validation" }, #br{},
         #link { text="Dynamically Removing Validation", url="/demos/clear_validation"}, #br{},
         #link { text="Autocompletion", url="/demos/textbox_autocomplete" }, #br{}, 
+        #link { text="TextboxList", url="/demos/textboxlist" }, #br{},
         #link { text="RESTful Forms", url="/demos/restful" }, #br{},
         #link { text="HTML and Custom Encoding", url="/demos/htmlencode"},#br{},
 
diff --git a/src/demos/demos_textboxlist.erl b/src/demos/demos_textboxlist.erl
new file mode 100644
index 0000000..7211397
--- /dev/null
+++ b/src/demos/demos_textboxlist.erl
@@ -0,0 +1,51 @@
+-module (demos_textboxlist).
+-include_lib ("nitrogen_core/include/wf.hrl").
+-compile(export_all).
+
+main() -> #template { file="./templates/demos46.html" }.
+
+title() -> "TextboxList".
+
+headline() -> "Textboxlist".
+
+left() -> 
+    [
+        "
+        <p>
+        The <code>#textboxlist{}</code> element effectively turns the input to a list of items that can be deleted.
+        </p>
+        <p>
+        The element configured to autocomplete the values.
+        </p>
+        ",
+        linecount:render()
+    ].
+
+right() -> 
+    [
+        #p{},
+        #label{ text="Enter tags" },
+        #textboxlist{ id=first, tag=auto1, autocomplete=false },
+        #button { id=submit2, text="Submit", postback= {submit, first} },
+        #p{},
+        #label { text="What's your favorite programming language?" },
+        #textboxlist { id=second, tag=auto2, values=["Erlang"] },
+        #button { id=submit1, text="Submit", postback= {submit, second} },
+        #p{},
+        #flash{}
+    ].
+
+textboxlist_event(SearchTerm, _Tag) ->
+  Data = ["Perl", "Php", "Erlang", "Ruby", "Scala"],
+  List = [{array, [
+    list_to_binary(T), % Id
+    list_to_binary(T), % Bit plain text
+    list_to_binary(T), % Bit html
+    list_to_binary(T)  % Suggestion item html
+  ] }
+  || T <- lists:filter(fun(E)-> string:str(string:to_lower(E), string:to_lower(SearchTerm)) > 0 end, Data)],
+  mochijson2:encode(List).
+
+event({submit, Id})->
+  wf:flash(wf:qs(Id));
+event(_) -> ok.
diff --git a/templates/demos433.html b/templates/demos433.html
index 272de77..38da7fe 100644
--- a/templates/demos433.html
+++ b/templates/demos433.html
@@ -7,6 +7,7 @@
     <script src='/nitrogen/jquery-ui.js' type='text/javascript' charset='utf-8'></script>
 <!--     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> -->
 <!--     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"></script> -->
+    <script src='/nitrogen/textboxlist.js' type='text/javascript' charset='utf-8'></script>
     <script src='/nitrogen/livevalidation.js' type='text/javascript' charset='utf-8'></script>
     <script src='/nitrogen/nitrogen.js' type='text/javascript' charset='utf-8'></script>
     <script src='/nitrogen/bert.js' type='text/javascript' charset='utf-8'></script>
diff --git a/templates/demos46.html b/templates/demos46.html
index 5cc9546..178efdc 100644
--- a/templates/demos46.html
+++ b/templates/demos46.html
@@ -7,6 +7,7 @@
     <script src='/nitrogen/jquery-ui.js' type='text/javascript' charset='utf-8'></script>
 <!--     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> -->
 <!--     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"></script> -->
+    <script src='/nitrogen/textboxlist.js' type='text/javascript' charset='utf-8'></script>
     <script src='/nitrogen/livevalidation.js' type='text/javascript' charset='utf-8'></script>
     <script src='/nitrogen/nitrogen.js?2' type='text/javascript' charset='utf-8'></script>
     <script src='/nitrogen/bert.js' type='text/javascript' charset='utf-8'></script>
diff --git a/templates/grid.html b/templates/grid.html
index 4393453..c6807a1 100644
--- a/templates/grid.html
+++ b/templates/grid.html
@@ -7,6 +7,7 @@
     <script src='/nitrogen/jquery-ui.js' type='text/javascript' charset='utf-8'></script>
 <!--     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> -->
 <!--     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"></script> -->
+    <script src='/nitrogen/textboxlist.js' type='text/javascript' charset='utf-8'></script>
     <script src='/nitrogen/livevalidation.js' type='text/javascript' charset='utf-8'></script>
     <script src='/nitrogen/nitrogen.js' type='text/javascript' charset='utf-8'></script>
     <link rel="stylesheet" href="/nitrogen/jquery-ui/jquery.ui.all.css" type="text/css" media="screen" charset="utf-8" />