Table js columns
时间: 2023-11-20 10:06:35 浏览: 27
As an AI language model, I do not have access to visual representation of tables, but I can provide some examples of column names that could be used in a JS table:
1. ID
2. Name
3. Date
4. Amount
5. Status
6. Description
7. Category
8. Created By
9. Updated By
10. Contact Info
相关问题
bootstrap-table selectColumns
Bootstrap-table 是一个基于 Bootstrap 的强大的 HTML 表格插件。要在 Bootstrap-table 中选择列,你可以使用 `selectColumns` 方法。
示例代码如下:
```javascript
$('#table').bootstrapTable({
columns: [{
field: 'id',
title: 'ID'
}, {
field: 'name',
title: 'Name'
}, {
field: 'age',
title: 'Age'
}, {
field: 'gender',
title: 'Gender'
}],
// 初始化表格时选择需要显示的列
onAllColumnsLoaded: function() {
$('#table').bootstrapTable('selectColumns', ['id', 'name']);
}
});
```
在这个示例中,我们定义了一个带有 `id`、`name`、`age` 和 `gender` 四个列的表格。在初始化表格时,我们使用 `onAllColumnsLoaded` 事件回调来选择需要显示的列。通过调用 `selectColumns` 方法并传入一个列字段的数组,我们可以指定要显示的列。
请注意,这只是一个示例代码,并且假设你已经正确引入了 Bootstrap 和 Bootstrap-table 插件。具体的实现可能会根据你的项目需求有所调整。
vxe-table :columns
vxe-table 是一个基于 Vue.js 的表格组件库,用于创建和展示数据表格。在使用 vxe-table 时,需要定义 columns 字段来描述表格的列信息。
columns 是一个数组,每个元素代表一个表格的列。每个列对象包含以下属性:
- type: 列的类型,可以是 'seq'(序号列)、'checkbox'(复选框列)或者 'selection'(选择列)。
- field: 列的字段名,用于与数据源中的属性进行关联。
- title: 列的标题。
- width: 列的宽度。
- align: 列的对齐方式,可以是 'left'、'center' 或 'right'。
- sortable: 是否可排序,可以是 true 或 false。
- resizable: 是否可拖动调整列宽,可以是 true 或 false。
- fixed: 是否固定列,可以是 'left'、'right' 或 true。
- filters: 是否可筛选,可以是一个数组,每个元素代表一个筛选项。
- filterMethod: 自定义筛选方法的回调函数。
示例代码如下:
```javascript
columns: [
{ type: 'selection', width: 50, align: 'center' },
{ field: 'name', title: '姓名', sortable: true },
{ field: 'age', title: '年龄', sortable: true },
{ field: 'gender', title: '性别', sortable: true },
],
```