diff --git a/examples/widgetapp/sample_page.e b/examples/widgetapp/sample_page.e
index 513cbe84..a4040ada 100644
--- a/examples/widgetapp/sample_page.e
+++ b/examples/widgetapp/sample_page.e
@@ -30,16 +30,29 @@ feature
 			create textbox_result.make_textarea ("txtBox3", "")
 			button1.set_click_event (agent handle_click)
 			create form.make_form_control ("panel")
+			form.add_class ("form-horizontal")
+			create cklist.make_checkbox_list_control("categories")
+			cklist.add_control (create {WSF_CHECKBOX_CONTROL}.make_checkbox("net","Network","net"))
+			cklist.add_control (create {WSF_CHECKBOX_CONTROL}.make_checkbox("os","Operating Systems","os"))
 			form.add_control (create {WSF_FORM_ELEMENT_CONTROL[STRING]}.make_form_element("Number1",textbox1))
 			form.add_control (create {WSF_FORM_ELEMENT_CONTROL[STRING]}.make_form_element("Number2",textbox2))
+			form.add_control (create {WSF_FORM_ELEMENT_CONTROL[LIST[STRING]]}.make_form_element("Categories",cklist))
 			form.add_control (button1)
 			form.add_control (create {WSF_FORM_ELEMENT_CONTROL[STRING]}.make_form_element("Result",textbox_result))
 			control := form
 		end
 
 	handle_click
+		local
+			text:STRING
 		do
-			textbox_result.set_text (textbox1.text + " + " + textbox2.text + " = " + (textbox1.text.to_integer_16 + textbox2.text.to_integer_16).out)
+			text := textbox1.text + " + " + textbox2.text + " = " + (textbox1.text.to_integer_16 + textbox2.text.to_integer_16).out
+			across
+				cklist.value as s
+			loop
+				text.append ("%N-"+s.item)
+			end
+			textbox_result.set_text (text)
 		end
 
 	process
@@ -52,6 +65,8 @@ feature
 
 	textbox2: WSF_TEXT_CONTROL
 
+	cklist: WSF_CHECKBOX_LIST_CONTROL
+
 	textbox_result: WSF_TEXTAREA_CONTROL
 
 end
diff --git a/examples/widgetapp/widget.coffee b/examples/widgetapp/widget.coffee
index 06d0b65c..9ca48ee9 100644
--- a/examples/widgetapp/widget.coffee
+++ b/examples/widgetapp/widget.coffee
@@ -71,12 +71,28 @@ class WSF_TEXTAREA_CONTROL extends WSF_CONTROL
       window.states[@control_name]['text'] = state.text
       @$el.val(state.text)
 
+class WSF_CHECKBOX_CONTROL extends WSF_CONTROL
+  attach_events: ()->
+    self = @
+    @$el.change ()->
+      self.change()
+  change: ()->
+    #update local state
+    window.states[@control_name]['checked'] = @$el.is(':checked')
+    if window.states[@control_name]['callback_change']
+      trigger_callback(@control_name, 'change')
+
+  update: (state) ->
+    if state.text?
+      window.states[@control_name]['checked'] = state.checked
+      @$el.prop('checked',state.checked)
+
 #map class name to effective class
 typemap =
   "WSF_BUTTON_CONTROL":WSF_BUTTON_CONTROL
   "WSF_TEXT_CONTROL":WSF_TEXT_CONTROL
   "WSF_TEXTAREA_CONTROL":WSF_TEXTAREA_CONTROL
-  "WSF_FORM_CONTROL":WSF_FORM_CONTROL
+  "WSF_CHECKBOX_CONTROL":WSF_CHECKBOX_CONTROL
 
 #create a js class for each control
 for name,state of window.states
diff --git a/examples/widgetapp/widget.js b/examples/widgetapp/widget.js
index 45a9abca..9cda85af 100644
--- a/examples/widgetapp/widget.js
+++ b/examples/widgetapp/widget.js
@@ -1,6 +1,6 @@
 // Generated by CoffeeScript 1.6.1
 (function() {
-  var $el, WSF_BUTTON_CONTROL, WSF_CONTROL, WSF_TEXTAREA_CONTROL, WSF_TEXT_CONTROL, controls, name, state, trigger_callback, type, typemap, _ref,
+  var $el, WSF_BUTTON_CONTROL, WSF_CHECKBOX_CONTROL, WSF_CONTROL, WSF_TEXTAREA_CONTROL, WSF_TEXT_CONTROL, controls, name, state, trigger_callback, type, typemap, _ref,
     __hasProp = {}.hasOwnProperty,
     __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
 
@@ -144,10 +144,45 @@
 
   })(WSF_CONTROL);
 
+  WSF_CHECKBOX_CONTROL = (function(_super) {
+
+    __extends(WSF_CHECKBOX_CONTROL, _super);
+
+    function WSF_CHECKBOX_CONTROL() {
+      return WSF_CHECKBOX_CONTROL.__super__.constructor.apply(this, arguments);
+    }
+
+    WSF_CHECKBOX_CONTROL.prototype.attach_events = function() {
+      var self;
+      self = this;
+      return this.$el.change(function() {
+        return self.change();
+      });
+    };
+
+    WSF_CHECKBOX_CONTROL.prototype.change = function() {
+      window.states[this.control_name]['checked'] = this.$el.is(':checked');
+      if (window.states[this.control_name]['callback_change']) {
+        return trigger_callback(this.control_name, 'change');
+      }
+    };
+
+    WSF_CHECKBOX_CONTROL.prototype.update = function(state) {
+      if (state.text != null) {
+        window.states[this.control_name]['checked'] = state.checked;
+        return this.$el.prop('checked', state.checked);
+      }
+    };
+
+    return WSF_CHECKBOX_CONTROL;
+
+  })(WSF_CONTROL);
+
   typemap = {
     "WSF_BUTTON_CONTROL": WSF_BUTTON_CONTROL,
     "WSF_TEXT_CONTROL": WSF_TEXT_CONTROL,
-    "WSF_TEXTAREA_CONTROL": WSF_TEXTAREA_CONTROL
+    "WSF_TEXTAREA_CONTROL": WSF_TEXTAREA_CONTROL,
+    "WSF_CHECKBOX_CONTROL": WSF_CHECKBOX_CONTROL
   };
 
   _ref = window.states;
diff --git a/library/server/wsf_html/webcontrol/wsf_checkbox_control.e b/library/server/wsf_html/webcontrol/wsf_checkbox_control.e
index bf40d944..b1281ac2 100644
--- a/library/server/wsf_html/webcontrol/wsf_checkbox_control.e
+++ b/library/server/wsf_html/webcontrol/wsf_checkbox_control.e
@@ -16,10 +16,11 @@ create
 
 feature {NONE}
 
-	make_checkbox (n: STRING; l: STRING)
+	make_checkbox (n: STRING; l: STRING; c: STRING)
 		do
 			make (n, "input")
 			label := l
+			checked_value := c
 		end
 
 feature {WSF_PAGE_CONTROL, WSF_CONTROL} -- STATE MANAGEMENT
@@ -67,7 +68,7 @@ feature -- Implementation
 			if checked then
 				attributes := attributes + " checked"
 			end
-			Result := render_tag ("", attributes)
+			Result := render_tag_with_tagname ("div",render_tag_with_tagname ("label", render_tag ("", attributes) + " " + label, "",""), "","checkbox")
 		end
 
 	value: BOOLEAN
@@ -81,6 +82,8 @@ feature
 
 	checked: BOOLEAN
 
+	checked_value: STRING
+
 	change_event: detachable PROCEDURE [ANY, TUPLE []]
 
 end
diff --git a/library/server/wsf_html/webcontrol/wsf_checkbox_list_control.e b/library/server/wsf_html/webcontrol/wsf_checkbox_list_control.e
index 9f9bd8e8..2c6cadd2 100644
--- a/library/server/wsf_html/webcontrol/wsf_checkbox_list_control.e
+++ b/library/server/wsf_html/webcontrol/wsf_checkbox_list_control.e
@@ -9,7 +9,14 @@ class
 
 inherit
 
-	WSF_MULTI_CONTROL[WSF_CHECKBOX_CONTROL]
+	WSF_VALUE_CONTROL [LIST [STRING]]
+		undefine
+			load_state,
+			read_state,
+			read_state_changes
+		end
+
+	WSF_MULTI_CONTROL [WSF_CHECKBOX_CONTROL]
 
 create
 	make_checkbox_list_control
@@ -21,4 +28,21 @@ feature {NONE}
 			make_multi_control (n)
 		end
 
+feature
+
+	value: LIST [STRING]
+		local
+			l: LINKED_LIST [STRING]
+		do
+			create l.make
+			across
+				controls as c
+			loop
+				if c.item.value then
+					l.extend (c.item.checked_value)
+				end
+			end
+			Result := l
+		end
+
 end
diff --git a/library/server/wsf_html/webcontrol/wsf_control.e b/library/server/wsf_html/webcontrol/wsf_control.e
index daa55405..8a092305 100644
--- a/library/server/wsf_html/webcontrol/wsf_control.e
+++ b/library/server/wsf_html/webcontrol/wsf_control.e
@@ -88,15 +88,22 @@ feature
 			loop
 				css_classes_string := css_classes_string + " " + c.item
 			end
-			if not css_classes_string.is_empty then
-				css_classes_string := " class=%"" + css_classes_string + "%""
-			end
+			Result:=render_tag_with_tagname(tag_name,body,attributes,css_classes_string)
+		end
 
-			Result := "<" + tag_name + " id=%"" + control_name + "%" data-name=%"" + control_name + "%" data-type=%"" + generator + "%" " + attributes + css_classes_string
-			if body.is_empty and not tag_name.is_equal("textarea") then
+	render_tag_with_tagname (tag, body, attributes,css_classes_string: STRING): STRING
+		local
+			l_attributes: STRING
+		do
+			l_attributes:=attributes
+			if not css_classes_string.is_empty then
+				l_attributes := " class=%"" + css_classes_string + "%""
+			end
+			Result := "<" + tag + " id=%"" + control_name + "%" data-name=%"" + control_name + "%" data-type=%"" + generator + "%" " + l_attributes
+			if body.is_empty and not tag.is_equal ("textarea") then
 				Result := Result + " />"
 			else
-				Result := Result + " >" + body + "</" + tag_name + ">"
+				Result := Result + " >" + body + "</" + tag + ">"
 			end
 		end
 
diff --git a/library/server/wsf_html/webcontrol/wsf_form_element_control.e b/library/server/wsf_html/webcontrol/wsf_form_element_control.e
index 90c15995..2550e79d 100644
--- a/library/server/wsf_html/webcontrol/wsf_form_element_control.e
+++ b/library/server/wsf_html/webcontrol/wsf_form_element_control.e
@@ -31,7 +31,10 @@ feature {NONE}
 		do
 			make (c.control_name + "_container", "div")
 			add_class ("form-group")
-			c.add_class ("form-control")
+			if attached {WSF_TEXT_CONTROL}c or attached {WSF_TEXTAREA_CONTROL}c then
+				c.add_class ("form-control")
+
+			end
 			value_control := c
 			validators := v
 			label := a_label