简单的SlickGrid DropDown选择列表celleditor

Question

我想要使用标准html选择列表编辑slickgrid中的值的最简单可能的解决方案。

这里有很多答案在stackoverflow所有这些都告诉你实现你自己的SelectCellEditor。下面是一些例子：

• Slickgrid, column with a drop down select list?
• SlickGrid select editor
• slickgrid custom dropdown editor

但这些例子都是在JavaScript，因此有点冗长。

所以我打算用精简的CoffeeScript版本回答我自己的问题。它适用于简单的选择列表，并且很容易在想要获得幻想时扩展。

Answer 1

一种简单SlickGrid SelectCellEditor中的CoffeeScript

class SelectCellEditor 
    last=undefined 
    constructor:(@args) -> 
     options = @args.column.options.split(",") 
     @select=$("<select/>") 
     .append("<option value=\"#{o}\">#{o}</option>" for o in options) 
     .appendTo(@args.container) 
     .focus() 

    loadValue: (item) -> 
     last = item[@args.column.field] 
     @select.val last 

    serializeValue : -> @select.val() 
    destroy   : -> @select.remove() 
    focus   : -> @select.focus() 
    isValueChanged : -> @select.val() isnt last 
    validate  : -> {valid: true, msg: null} 
    applyValue  : (item, state) -> item[@args.column.field] = state 

用法

使用slickgrid columns定义，SelectCellEditor经由editor属性施加有选择的项目的列表中提供使用options属性，如下所示：

​​