slickgrid定制下拉菜单编辑器(slickgrid custom dropdown edito

一个小区需要显示一个下拉（选择列表的）从RESTful服务未来价值，我在slickgrid工作一个。 这些值是每一行不同。

我应该能够选择从该列表（下拉列表）一个值，它应该坚持在单元格的值。

我会很高兴，如果有人可以帮助解决这个问题。

this.productColumns = [
            {
                id: 'statusid',
                name: 'Status',
                field: 'statusid',
                width: 65,
                sortable: true
            },
            {
                id: 'grade',
                name: 'Grade',
                field: 'grade',
                width: 80,
                sortable: true
            },
            {
                id: 'position',
                name: 'Position',
                field: 'originalPosition',
                width: 80,
                sortable: true
            },
            {
                id: 'tyresize',
                name: 'Tyre Size',
                field: 'tyreSize',
                editable: true,
                width: 140,
                sortable: true
            },
            {
                id: 'tyredetail',
                name: 'Tyre Detail',
                field: 'tyredetail',
                editable: true,
                width: 125,
                editor: this.selectRangeEditor

            }
   ]

      selectRangeEditor: function (args) {

        var $select = $("");
        var defaultValue = "";
        var scope = this;
        this.init = function () {
            var tyreOptionsList = new TyreOptionsModel(args.item.id);
            tyreOptionsList.deferred.done(function () {
                var opt_values = tyreOptionsList.toJSON();
                var count = 0;
                for (var cnt in opt_values) {
                    if (opt_values.hasOwnProperty(cnt)) {
                        count++;
                    }
                }
                option_str = ""
                var i ;
                for (i = 0; i < count-1; i++) {
                    val = opt_values[i].tyreOptionId;
                    txt = opt_values[i].tyreDetail;
                    option_str += "<OPTION value='" + val + "'>" + txt + "</OPTION>";
                }
                $select = $("<SELECT tabIndex='0' class='editor-select'>" + option_str + "</SELECT>");
                $select.appendTo(args.container);
                $select.focus();
            });
        };

       this.destroy = function () {
          $(args.container).empty();
        };

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

        this.serializeValue = function () {
          return $select.val();
        };

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

        this.loadValue = function (item) {
          defaultValue = item.attributes[args.column.field];
            $select.val(defaultValue);
        };

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

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

        this.init();
        return $select.val();
      }

Answer 1:

你有没有看到我的回答这个问题 ？

如果你能得到休息的服务选项的每一行而产生的页面，你可以使用我在客户端解决方案...

据我了解，从你发表意见，问题是如何将用户改变某些字段后回传在网格中所做的更改...

我解决了这个通过将下面的代码片段中，请注意表格的JS代码提交，在服务器端处理这种输入的数据，使用REST类型的服务，以保存它。

<div id="myGrid" style="width:90%;height:250px;"></div>
<form action="" method="POST">
  <input id="save_grid_changes" disabled="disabled" type="submit" value="Save changes to {{obj_type}}(s)">
  <input type="hidden" name="obj_type" value="{{obj_type}}">
  <input type="hidden" name="data" value="">

</form>

<script>
$(document).ready(function() {

    grid = new Slick.Grid($("#myGrid"), griddata, columns, options);

    $("form").submit(
      function() {
        // commit the last edit ...
        grid.getEditController().commitCurrentEdit(); 
        grid.resetCurrentCell();
        $("input[name='data']").val( $.toJSON(griddata) );
        // ("input[name='data']").val($.param(data));
    });
  });  
</script>

文章来源: slickgrid custom dropdown editor