如何突出显示不可编辑的背景细胞?

时间:2013-12-25 10:55:14

标签: javascript css backbone.js backgrid

我正在使用骨干和背景。

我想让一些背景细胞不可编辑并突出显示它们。

我正在寻找这些单元格的简单css属性。

但遗憾的是,backgrid不会对不可编辑的单元格强加任何特定的类。

这是来自backgrid网站的渲染的一个背景行:http://backgridjs.com/我们知道id字段在这里是不可编辑的:

    <tr>
<td class="integer-cell">1</td>
<td class="string-cell">Afghanistan</td>
<td class="integer-cell">25,500,100</td>
<td class="number-cell">0.36</td>
<td class="date-cell">2013-01-01</td>
<td class="uri-cell"><a tabindex="-1" href="http://en.wikipedia.org/wiki/Afghanistan" title="http://en.wikipedia.org/wiki/Afghanistan" target="_blank">http://en.wikipedia.org/wiki/Afghanistan</a></td>
</tr>

现在我如何实现同样的目标?

2 个答案:

答案 0 :(得分:0)

那些你不想编辑的单元格,为它们添加一些类然后转到backgrid.js的源代码并找到启用了editmode的函数,我不知道究竟是哪个函数处理,可能是

render: function () {
enterEditMode: function () {

然后检查该单元格的类名称,如

$("#mydiv").hasClass("dont_edit"); OR this.hasClass("dont_edit");

如果是,那么只需“返回”,否则允许编辑。你必须通过反复试验来解决它,直到有人用确切的代码帮助你。最好先开始帮助自己。

答案 1 :(得分:0)

Backgrid.Cell #initialize具有以下代码

if (Backgrid.callByNeed(column.editable(), column, model)) $el.addClass("editable");

这意味着所有可编辑的单元格都具有可编辑的&#34; css课。所有不可编辑的单元格都没有这个类。

因此,通过应用下面的CSS选择器,我可以根据需要设置不可编辑的单元格样式:

backgrid td.renderable:not(.editable) {
   background-color: gray
}