title: Header Dropdown in ui-grid AngularJS
body: <p>I am trying to get dropdown values in header for one of the field in ui-grid. For the same field I have the dropdown for every row working fine. Based on the header dropdown selection every dropdown values in rows should be selected. Here is my plunker link. Can someone help please?</p>
  
  <p>Here's <a href="http://plnkr.co/edit/lvMU1xyVljxty5LDzbUe?p=preview" rel="nofollow noreferrer">a link</a>!</p>
  
  <pre><code>var jsonDef = { name: 'Status', field: 'Status', width: 150, 
  editType: 'dropdown', 
  editableCellTemplate: 'ui-grid/dropdownEditor', 
  headerCellTemplate: '&lt;div class="ui-grid-cell-contents header-tcsi"&gt;&lt;select 
  ng-required = "true" ng-options="options.id as options.type for tcsiOption 
  in grid.appScope.MainCtrl" ng-model="grid.appScope.selectedTCSI"&gt;&lt;/select&gt; 
  &lt;/div&gt;',
  editDropdownIdLabel: 'id', 
  editDropdownValueLabel: 'type',
  filter: { 
  type: uiGridConstants.filter.SELECT, 
  condition: uiGridConstants.filter.EXACT } 
  };
  
  var options = [{
  id: 1,
  type: 'Closed'
  }, {
  id: 2,
  type: 'Pending'
  }, {
  id: 3,
  type: 'Open'
  }];
  </code></pre>