如何让 jsGrid 使用 Bootstrap 样式?
How can I get jsGrid to use Bootstrap styles?
我有一个表格 UI,我在 HTML 中用 Bootstrap table 样式绘制了草图,现在我正在使用 jsGrid 使它起作用,我讨厌它,我想让 jsGrid 使用 Bootstrap CSS 而不是它自己的
在Bootstrap中:
在 jsGrid 中:
我的模型代码非常简单(删除了重复的行):
<table class="table table-striped light">
<tr>
<th>Team</th>
<th>Agent</th>
<th>State</th>
<th>Duration</th>
</tr>
<tr><td>GLAM-pg01-s</td><td>Mildred Drysdale</td><td>Idle</td><td>01:39:33</td></tr>
<tr><td>GLAM-pg01-s</td><td>Mildred Drysdale</td><td>Idle</td><td>01:39:33</td></tr>
<tr><td>GLAM-pg01-s</td><td>Mildred Drysdale</td><td>Idle</td>
</table>
问题是,jsGrid 似乎只允许 CSS 应用于 ROWS 和 CELLS,而不是整体 table。
我将在渲染后尝试获取 DOM,并在 jsGrid 将其写入后使用 table 标签进行 futzing,希望可以做到。但我希望更了解 jsGrid 的人可以提供一个“公认的”程序来放弃默认设置 CSS.
为什么滚动条显示时没有拇指?呃...
好吧,这就是我的想法 - 我只是在 类 元素被 jsGrid 渲染后添加到 DOM 元素。它还纠正了错误的滚动。
function displayData(results) {
$('#daGrid').jsGrid( {
width: '100%',
height: '90%',
autoload: false,
selecting: true,
data: results,
rowClick: onRowClick,
fields: chatAgents.layout
});
correctCSS();
}
function correctCSS() {
$('table').addClass('table table-striped light');
var h = $('.jsgrid-grid-body').css('height');
if( h ) {
h = h.match((/\d*/));
if( h[0] > 500 ) {
$('.jsgrid-grid-body').height(490);
$('.jsgrid-grid-body').css('overflow-y', 'scroll');
}
}
}
我有一个表格 UI,我在 HTML 中用 Bootstrap table 样式绘制了草图,现在我正在使用 jsGrid 使它起作用,我讨厌它,我想让 jsGrid 使用 Bootstrap CSS 而不是它自己的
在Bootstrap中:
在 jsGrid 中:
我的模型代码非常简单(删除了重复的行):
<table class="table table-striped light">
<tr>
<th>Team</th>
<th>Agent</th>
<th>State</th>
<th>Duration</th>
</tr>
<tr><td>GLAM-pg01-s</td><td>Mildred Drysdale</td><td>Idle</td><td>01:39:33</td></tr>
<tr><td>GLAM-pg01-s</td><td>Mildred Drysdale</td><td>Idle</td><td>01:39:33</td></tr>
<tr><td>GLAM-pg01-s</td><td>Mildred Drysdale</td><td>Idle</td>
</table>
问题是,jsGrid 似乎只允许 CSS 应用于 ROWS 和 CELLS,而不是整体 table。
我将在渲染后尝试获取 DOM,并在 jsGrid 将其写入后使用 table 标签进行 futzing,希望可以做到。但我希望更了解 jsGrid 的人可以提供一个“公认的”程序来放弃默认设置 CSS.
为什么滚动条显示时没有拇指?呃...
好吧,这就是我的想法 - 我只是在 类 元素被 jsGrid 渲染后添加到 DOM 元素。它还纠正了错误的滚动。
function displayData(results) {
$('#daGrid').jsGrid( {
width: '100%',
height: '90%',
autoload: false,
selecting: true,
data: results,
rowClick: onRowClick,
fields: chatAgents.layout
});
correctCSS();
}
function correctCSS() {
$('table').addClass('table table-striped light');
var h = $('.jsgrid-grid-body').css('height');
if( h ) {
h = h.match((/\d*/));
if( h[0] > 500 ) {
$('.jsgrid-grid-body').height(490);
$('.jsgrid-grid-body').css('overflow-y', 'scroll');
}
}
}