Select2 Dropdown in Internet Explorer shows [object screen] instead of correct value

Question

I'm using select2 in a dropdown which is placed into a js grid (the awesome slickgrid). The dropdown works fine in all browsers, but not in Internet Explorer. Instead of showing the dropdown values it shows [object screen] for each option. It seems to be "only" a UI issue, as if a select one of the [object screen]s the correct value is selected.

Whereas the source below is probably hard to understand for somebody without slickgrid experience, but maybe somebody has encountered a similar [object screen] issue and knows what might be wrong. Thanks for your help!

The dropdown is created as follows:

//SETUP DAY RATE DROPDOWN OPTIONS
    var day_rate_options = [
        {value: null, screen: ""},
        {value: "1", screen: "Standard"},
        {value: "2", screen: "High"},
    ];


var columns = [
     {id: "work_package", name: "Work Package", field: "work_package", width: 180, formatter: WPFormatter, editor: Slick.Editors.DropDown, options: wp_options, sortable: false, selectable: true},
     {id: "day_rate", name: "Day Rate", field: "day_rate", width: 100, formatter: DayRateFormatter, editor: Slick.Editors.DropDown, options: day_rate_options, sortable: false, selectable: true},
     {id: "Links", name: "", field: "id", width: 50, cssClass: "cell-title", cssClass: "cell-links", formatter: LinkFormatter, selectable: false},
 ];

The slickgrid drop down editor:

function DropDownEditor(args) {
      var $select;
      var defaultValue;
      var scope = this;

      this.init = function() {
          if(args.column.options){
              option_str = ""
              options = args.column.options
              for( i in options){
                  value = options[i].value;
                  screen = options[i].screen;
                  option_str += "<OPTION value='"+value+"'>"+screen+"</OPTION>";
                }
          }
          $select = $("<SELECT tabIndex='0' class='editor-select select2-search'>"+ option_str +"</SELECT>");
          $select.appendTo(args.container);
          $select.bind("keydown.nav", function (e) {
              if (e.keyCode === $.ui.keyCode.TAB) {
                e.stopImmediatePropagation();
              }
            })
          $select.focus();
          $select.select2();
      };

      this.destroy = function() {
          $select.remove();
      };

      this.focus = function() {
          $select.focus();
      };

      this.setValue = function(value) {
          $select.val(value);
          defaultValue = value;
      };

      this.loadValue = function(item) {
          field = args.column.field;
          if(item[field + "_id"]){
              defaultValue = item[field + "_id"];
          }
          else {
              defaultValue = item[args.column.field];
          }
          $select.val(defaultValue);
      };

      this.serializeValue = function() {
          if(args.column.options){
            return $select.val();
          }else{
            return ($select.val() == "yes");
          }
      };

      this.applyValue = function(item,state) {
          item[args.column.field] = state;
      };

      this.isValueChanged = function() {
          return ($select.val() != defaultValue);
      };

      this.validate = function() {
          return {
              valid: true,
              msg: null
          };
      };
      this.init();
  }