我已经完成了研究,我知道如何制作自定义格式化程序或编辑器以及如何使用它。我的问题是,我无法设置或使用格式化程序。我的结构:
jQuery 包括:
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.event.drag-2.2.js"></script>
<script type="text/javascript" src="slick.core.js"></script>
<script type="text/javascript" src="slick.editors.js"></script>
<script type="text/javascript" src="slick.formatters.js"></script>
<script type="text/javascript" src="slick.grid.js"></script>
上面的一切都是未经编辑的。实现网格的代码:
var grid; var cols; var rows; var options = {
enableCellNavigation: true,
enableColumnReorder: false,
forceFitColumns: true
};
*rows and cols come from server side via JSON.parse*
grid = new Slick.Grid("#results", rows, cols, options);
来自服务器并填充 rows 和 cols 变量的代码基本上是这样的:
cols:
echo json_encode('[
{"id":"price", "name":"Ár", "field":"price"},
{"id":"location", "name":"Elhelyezkedés", "field":"location"},
{"id":"egyeb", "name":"Lófasz", "field":"egyeb"},
{"id":"pic", "name":"Képek", "field":"pic", "formatter":"Slick.Formatters.PercentComplete"}
]');
rows:
echo json_encode('[
{"price": "5", "location":"AlsóBélaCsecselény", "egyeb":"lófasz", "pic":"1", "link":"ezittahelye"},
{"price": "6", "location":"qrsóBéqrcselény", "egyeb":"lófasz", "pic":"2", "link":"ezittahelye"},
{"price": "7", "location":"AlsóBélaqwqwrelény", "egyeb":"lófasz", "pic":"3", "link":"ezittahelye"},
{"price": "8", "location":"qwrCsecselény", "egyeb":"lófasz", "pic":"4", "link":"ezittahelye"}
]');
一切正常,当 pic 列没有格式化程序时,网格也可以使用列的额外属性,例如错误输入的“格式化程序”标签(如“fformatter”或其他),
但是每次 JSON 代码具有“格式化程序”属性时,Javascript 都会给我以下错误:
未捕获的异常:TypeError: 'getFormatter(row, m)' is not a function
每次我尝试加载表格时,格式化程序都会搞砸一切,我不知道下一步该做什么!我试图追溯这个错误,它把我带到了 slick.grid.js 源代码的 1124. 行,这个函数不知何故用 return 语句破坏了一切。
function getFormatter(row, column) {
var rowMetadata = data.getItemMetadata && data.getItemMetadata(row);
// look up by id, then index
var columnOverrides = rowMetadata &&
rowMetadata.columns &&
(rowMetadata.columns[column.id] || rowMetadata.columns[getColumnIndex(column.id)]);
return (columnOverrides && columnOverrides.formatter) ||
(rowMetadata && rowMetadata.formatter) ||
column.formatter ||
(options.formatterFactory && options.formatterFactory.getFormatter(column)) ||
options.defaultFormatter;
}
任何帮助,将不胜感激!
编辑:这是我从服务器获取代码的方式:
$.post( "queries.php?event=search&&phase=columns", $("#full_search").serialize(), function(data){
cols = JSON.parse(data);
alert(cols[1].id);
$.post( "queries.php?event=search&&phase=rows", $("#full_search").serialize(), function(data){
rows = JSON.parse(data);
alert(rows[1].link);
grid = new Slick.Grid("#results", rows, cols, options);
alert(grid.getData().length);
return false;
},"json");
return false;
},"json");
},"json");