SlickGrid のエディターを拡張し、html Select と MultiSelect をサポートしました。MultiSelectEditor のソースは次のとおりです。
function PickListEditor(args) {
var $select;
var defaultValue ;
var scope = this;
this.init = function() {
console.log("PickListEditor... SelectValues");
console.log(args.column.columnSelectItems);
option_str = ""
var length = args.column.columnSelectItems.length;
for(var i = 0; i< length ; i++){
var selectOption = args.column.columnSelectItems[i];
if(selectOption["disable"]==true) disable = "disable";
option_str += "<OPTION value='"+selectOption["stringValue"]+"'>"+selectOption["label"]+"</OPTION>";
}
$select = $("<select tabIndex='0' multiple='multiple'>"+ option_str +"</select>");
console.log(args.container);
$select.appendTo(args.container);
$(args.container).append($select[0]);
console.log($select);
console.log($select[0]);
$select.focus();
};
this.destroy = function() {
$select.remove();
};
this.focus = function() {
$select.focus();
};
this.loadValue = function(item) {
console.log("loaded Item : ");
console.log(item);
defaultValue = item[args.column.field];
$select.val(defaultValue);
};
this.serializeValue = function() {
if(args.column.columnSelectItems){
return $select.val();
}else{
return "";
}
};
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();
}
複数選択は、Firefox 17.0 で正常に動作します。しかし、chrome 23.0.1271.95 または safari 6.0.2 では、複数選択が表示されますが、アイテムを選択できません。
誰かアイデアはありますか?
乾杯、ボリス。