diff --git a/IPython/html/widgets/selection/__init__.py b/IPython/html/widgets/selection/__init__.py
new file mode 100644
index 0000000..6d2fc06
--- /dev/null
+++ b/IPython/html/widgets/selection/__init__.py
@@ -0,0 +1 @@
+from widget import SelectionWidget
\ No newline at end of file
diff --git a/IPython/html/widgets/selection/model.js b/IPython/html/widgets/selection/model.js
new file mode 100644
index 0000000..7741f82
--- /dev/null
+++ b/IPython/html/widgets/selection/model.js
@@ -0,0 +1,2 @@
+var SelectionWidgetModel = IPython.WidgetModel.extend({});
+IPython.notebook.widget_manager.register_widget_model('SelectionWidgetModel', SelectionWidgetModel);
diff --git a/IPython/html/widgets/selection/view_dropdown.js b/IPython/html/widgets/selection/view_dropdown.js
new file mode 100644
index 0000000..45c2ab7
--- /dev/null
+++ b/IPython/html/widgets/selection/view_dropdown.js
@@ -0,0 +1,62 @@
+var DropdownView = IPython.WidgetView.extend({
+
+ // Called when view is rendered.
+ render : function(){
+
+ this.$el
+ .html('')
+ .addClass(this.model.comm.comm_id);
+ this.$buttongroup = $('
')
+ .addClass('btn-group')
+ .appendTo(this.$el);
+ this.$droplabel = $('')
+ .addClass('btn')
+ .appendTo(this.$buttongroup);
+ this.$dropbutton = $('')
+ .addClass('btn')
+ .addClass('dropdown-toggle')
+ .attr('data-toggle', 'dropdown')
+ .html('')
+ .appendTo(this.$buttongroup);
+ this.$droplist = $('')
+ .addClass('dropdown-menu')
+ .appendTo(this.$buttongroup);
+
+ // Set defaults.
+ this.update();
+ },
+
+ // Handles: Backend -> Frontend Sync
+ // Frontent -> Frontend Sync
+ update : function(){
+ this.$droplabel.html(this.model.get('value'));
+
+ var items = this.model.get('values');
+ this.$droplist.html('');
+ for (var index in items) {
+ var that = this;
+ var item_button = $('')
+ .html(items[index])
+ .on('click', function(e){
+ that.model.set('value', $(e.target).html(), this );
+ })
+
+ this.$droplist.append($('').append(item_button))
+ }
+
+ if (this.model.get('disabled')) {
+ this.$buttongroup.attr('disabled','disabled');
+ this.$droplabel.attr('disabled','disabled');
+ this.$dropbutton.attr('disabled','disabled');
+ this.$droplist.attr('disabled','disabled');
+ } else {
+ this.$buttongroup.removeAttr('disabled');
+ this.$droplabel.removeAttr('disabled');
+ this.$dropbutton.removeAttr('disabled');
+ this.$droplist.removeAttr('disabled');
+ }
+ },
+
+});
+
+IPython.notebook.widget_manager.register_widget_view('DropdownView', DropdownView);
diff --git a/IPython/html/widgets/selection/view_radiobutton.js b/IPython/html/widgets/selection/view_radiobutton.js
new file mode 100644
index 0000000..db473fa
--- /dev/null
+++ b/IPython/html/widgets/selection/view_radiobutton.js
@@ -0,0 +1,63 @@
+var RadioButtonView = IPython.WidgetView.extend({
+
+ // Called when view is rendered.
+ render : function(){
+ this.$el
+ .html('')
+ .addClass(this.model.comm.comm_id);
+ this.update();
+ },
+
+ // Handles: Backend -> Frontend Sync
+ // Frontent -> Frontend Sync
+ update : function(){
+
+ // Add missing items to the DOM.
+ var items = this.model.get('values');
+ for (var index in items) {
+ var item_query = ' :input[value="' + items[index] + '"]';
+ if (this.$el.find(item_query).length == 0) {
+ var $label = $('')
+ .addClass('radio')
+ .html(items[index])
+ .appendTo(this.$el);
+
+ var that = this;
+ $('')
+ .attr('type', 'radio')
+ .addClass(this.model)
+ .val(items[index])
+ .prependTo($label)
+ .on('click', function(e){
+ that.model.set('value', $(e.target).val(), this);
+ that.model.apply();
+ });
+ }
+
+ if (this.model.get('value') == items[index]) {
+ this.$el.find(item_query).prop('checked', true);
+ } else {
+ this.$el.find(item_query).prop('checked', false);
+ }
+ }
+
+ // Remove items that no longer exist.
+ this.$el.find('input').each(function(i, obj) {
+ var value = $(obj).val();
+ var found = false;
+ for (var index in items) {
+ if (items[index] == value) {
+ found = true;
+ break;
+ }
+ }
+
+ if (!found) {
+ $(obj).parent().remove();
+ }
+ });
+ },
+
+});
+
+IPython.notebook.widget_manager.register_widget_view('RadioButtonView', RadioButtonView);
diff --git a/IPython/html/widgets/selection/widget.py b/IPython/html/widgets/selection/widget.py
new file mode 100644
index 0000000..44a6e31
--- /dev/null
+++ b/IPython/html/widgets/selection/widget.py
@@ -0,0 +1,15 @@
+import os
+
+from ..widget import Widget
+from IPython.utils.traitlets import Unicode, List, Bool
+from IPython.utils.javascript import display_all_js
+
+class SelectionWidget(Widget):
+ target_name = Unicode('SelectionWidgetModel')
+ default_view_name = Unicode('DropdownView')
+ _keys = ['value', 'values', 'disabled']
+
+ value = Unicode()
+ values = List() # List of values the user can select
+ disabled = Bool(False) # Enable or disable user changes
+
\ No newline at end of file