title: Multiple dropdown selection in ag-grid (link Attached)
body: <p>I need to have a column in ag-grid where i can select multiple values from dropdown. I just googled online to see if it is already implemented but i could find only one link.</p>
  
  <p><a href="https://gist.github.com/gaborsomogyi/00f46f3c0ee989b73c92" rel="nofollow">https://gist.github.com/gaborsomogyi/00f46f3c0ee989b73c92</a></p>
  
  <p>Can someone let me know how to implement it. show the full code as an example please. </p>
  
  <p>Here is the code shared over there. </p>
  
  <pre><code> function agDropDownEditor(params, optionsName, optionsList) {
  
      _.set(params.$scope, optionsName+'.optionsList', optionsList);
  
      var html = '&lt;span style="width:100%; display:inline-block" ng-show="!'+optionsName+'.editing" ng-click="'+optionsName+'.startEditing()"&gt;{{data.'+params.colDef.field+'}}&lt;/span&gt; ' +
          '&lt;select style="width:100%" ng-blur="'+optionsName+'.editing=false" ng-change="'+optionsName+'.editing=false" ng-show="'+optionsName+'.editing" ng-options="item for item in '+optionsName+'.optionsList" ng-model="data.'+params.colDef.field+'"&gt;';
  
      // we could return the html as a string, however we want to add a 'onfocus' listener, which is not possible in AngularJS
      var domElement = document.createElement("span");
      domElement.innerHTML = html;
  
      _.set(params.$scope, optionsName+'.startEditing', function() {
          _.set(params.$scope, optionsName+'.editing', true); // set to true, to show dropdown
  
          // put this into $timeout, so it happens AFTER the digest cycle,
          // otherwise the item we are trying to focus is not visible
          $timeout(function () {
              var select = domElement.querySelector('select');
              select.focus();
          }, 0);
      });
  
      return domElement;
  }
  </code></pre>