javascript 如何在jQuery中使用handsontable设置特定单元格的属性?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18278217/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to set properties for specific cells with handsontable in jQuery?
提问by John Sly
I'm working on some stuff with handsontable and I want to create a function to really add soem formatting. Specifically, I'd like to have options to change background coloring and font attributes.
我正在使用 handsontable 处理一些东西,我想创建一个函数来真正添加 soem 格式。具体来说,我希望有更改背景颜色和字体属性的选项。
I've been able to get into the context menu to add a button, as well as getting the coordinates for the selected cell, but I can't find the way to set formatting options other then on the init call for handsontable.
我已经能够进入上下文菜单来添加一个按钮,以及获取所选单元格的坐标,但我找不到设置格式选项的方法,而不是在 Handsontable 的 init 调用中。
This is the documentation I've been looking at, https://github.com/warpech/jquery-handsontable/wiki/Options#cell-optionsand I'm hoping there's some more elsewhere.
这是我一直在查看的文档,https://github.com/warpech/jquery-handsontable/wiki/Options#cell-options,我希望其他地方还有更多。
I don't have code to provide since this is a project that's locked up, but I'm really looking at how I can set formatting options for an individual cell that isn't on init.
我没有要提供的代码,因为这是一个被锁定的项目,但我真的在研究如何为不在 init 上的单个单元格设置格式选项。
采纳答案by John Sly
This took a little digging through the documentation, but I did find it...
这需要对文档进行一些挖掘,但我确实找到了它......
This example will give red font to all of the selected cells.
此示例将为所有选定的单元格提供红色字体。
callback: function (key, options) {
var cell = $("#dataBlock'. $val['id'] .'").handsontable(\'getSelected\');
var startRow = cell[0];
var startCol = cell[1];
var endRow = cell[2];
var endCol = cell[3];
if (key === "redFont") {
setTimeout(function () {
curRow = startRow;
curCol = startCol;
while(curRow <= endRow){
curCol = startCol;
while(curCol <= endCol){
check = $("#dataBlock'. $val['id'] .'").handsontable("getCell", curRow, curCol);
check.style.color = "red";
curCol += 1;
}
curRow += 1;
}
}, 100);
}
}
回答by jomofrodo
If you use jQuery, you can use the standard addClass/removeClass functions.
如果您使用 jQuery,则可以使用标准的 addClass/removeClass 函数。
I have a page global Handsontable instance I call "hot". Given the rowNum and the colNum:
我有一个页面全局 Handsontable 实例,我称之为“热”。给定 rowNum 和 colNum:
var cell = hot.getCell(rowNum,colNum);
$(cell).addClass('yellow');
回答by Anthony Haffey
I tried jomofrodo's solution, which didn't work for me trying to change the background color using a class - but it did inspire something that did work:
我尝试了 jomofrodo 的解决方案,这对我尝试使用类更改背景颜色不起作用 - 但它确实激发了一些有用的东西:
var cell = handsOnTable_Conditions.getCell(x_coord,y_coord);
$(cell).css('background-color','red');
However, changing class directly could have advantages of flexibility over this solution of changing the style directly.
但是,与这种直接更改样式的解决方案相比,直接更改类可能具有灵活性的优势。
回答by Bhaumik Mehta
Define the renderer function
定义渲染器函数
function valueRenderer(instance, td, row, col, prop, value, cell) {
if (row === 0 && col === 1) {
$(td).css('color', 'green');
}
if (col > 3) {
$(td).addClass('custom');
}
if (col === 5) {
cellProperties.readOnly = true;
}
if (col > 3 && col < 10) {
cellProperties.type = 'numeric';
}
....
....
so on...
}
and then in handsontable cells option
然后在可手持单元格选项中
cells: function (row, col, prop) {
var cellProperties = {};
cellProperties.renderer = valueRenderer;
return cellProperties;
}
This way you can change properties, apply classes, change colors on the fly etc.
通过这种方式,您可以更改属性、应用类、动态更改颜色等。