     onChange: Function.prototype
 
   getInitialState: ->
+    filters: {}
     selectedChoiceID: ''
 
   render: ->
     <div className="survey-task">
       {if @state.selectedChoiceID is ''
-        <Chooser task={@props.task} onChoose={@handleChoice} />
+        <Chooser task={@props.task} filters={@state.filters} onFilter={@handleFilter} onChoose={@handleChoice} />
       else
         <ChoiceDetails task={@props.task} choiceID={@state.selectedChoiceID} onCancel={@clearSelection} onConfirm={@handleAnnotation} />}
     </div>
 
+  handleFilter: (characteristicID, valueID) ->
+    if valueID is ''
+      delete @state.filters[characteristicID]
+    else
+      @state.filters[characteristicID] = valueID
+    @setState filters: @state.filters
+
   handleChoice: (choiceID) ->
     @setState selectedChoiceID: choiceID
+
+  clearFilters: ->
+    @setState filters: {}
 
   clearSelection: ->
     @setState selectedChoiceID: ''
 
   handleAnnotation: (choice, details, e) ->
+    filters = JSON.parse JSON.stringify @state.filters
+
+    @props.annotation.value ?= []
+    @props.annotation.value.push {choice, details, filters}
+    @props.onChange e
+
+    @clearFilters()
     @clearSelection()
-    @props.annotation.value ?= []
-    @props.annotation.value.push {choice, details}
-    @props.onChange e

    </div>

  handleFilter: (characteristicID, e) ->
    value = e.target.value
    if e.target.value is ''
      delete @state.filters[characteristicID]
    else
      @state.filters[characteristicID] = value
    @setState filters: @state.filters

ChoiceDetails = React.createClass
  displayName: 'ChoiceDetails'

        <div key={characteristicID}>
          <label>
            {characteristic.label}{' '}
            <select value={@props.filters[characteristicID] ? ''} onChange={@handleFilter.bind this, characteristicID}>
              <option value="">(Any)</option>
              {for valueID in characteristic.valuesOrder
                value = characteristic.values[valueID]
