1

我在一个下拉列表中使用 select2 ，该下拉列表被放置到一个 js 网格（很棒的 slickgrid）中。该下拉菜单在所有浏览器中都可以正常工作，但在 Internet Explorer 中却不行。它没有显示[object screen]为每个选项显示的下拉值。这似乎是“仅”一个 UI 问题，就好像选择了 [object screen] 之一，选择了正确的值。

而对于没有 slickgrid 经验的人来说，下面的源代码可能很难理解，但也许有人遇到过类似的 [object screen] 问题并且知道可能出了什么问题。谢谢你的帮助！

在此处输入图像描述

下拉菜单创建如下：

//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},
 ];

slickgrid 下拉编辑器：

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();
  }
4

0 回答 0