flexgrid表格如何实现单选问题？
问题描述：
需求是进入该表格页面，会传一个值来判断，是单选框还是多选框（复选框）；此处单选框是该表只能选一项；复选框则可以多选。
我自己查api调试代码，感觉应该是自动根据源代码循环出来checkbox的。现在不知道如何实现该功能，大佬给点提示解决思路。
2.顺便问一下，取出选中行数据按钮，回显选中行按钮；这两个按钮触发之后，打印返回的数据为空，这个是为什么……大佬求指点（demo中里面写了假数据，如果能点击按钮实现功能，那么就能console打印出非空数组来）。 您好:
1. 关于单选的问题, 要实现Radio比较困难, 如果只想选中单行, 推荐用single row的选择模式,参考示例:
https://www.grapecity.com/wijmo/demos/Grid/Selection/Overview/purejs
2. 具体指的是哪个Demo? 如果是你自己实现的Demo, 能否提供一个可执行的Demo包? KevinChen 发表于 2021-2-1 17:25
您好:
1. 关于单选的问题, 要实现Radio比较困难, 如果只想选中单行, 推荐用single row的选择模式,参考示例 ...
你好，此处追加的问题2，和问题1都是公用第一个demo；即flexgrid.gar那个包 你好, 从实现上看, 这部分代码与产品没有关联, 建议仔细Debug你的代码实现. KevinChen 发表于 2021-2-1 17:25
您好:
1. 关于单选的问题, 要实现Radio比较困难, 如果只想选中单行, 推荐用single row的选择模式,参考示例 ...
是这样的，我这边是想用checkbox的复选框实现单选的功能（类似于radio）。flexgrid封装的功能或api是不能实现么，是需要我自己想办法写是吧； 南渡北归 发表于 2021-2-2 14:49
是这样的，我这边是想用checkbox的复选框实现单选的功能（类似于radio）。flexgrid封装的功能或api是不能 ...
版主您好，我还是需要有一个勾选框:'(不知道好不好实现 KevinChen 发表于 2021-2-1 21:16
你好, 从实现上看, 这部分代码与产品没有关联, 建议仔细Debug你的代码实现.
版主打扰了。请问您，checkbox这个勾选框在flexgrid里面，有没有出发的时间event；问一下。:handshake 南渡北归 发表于 2021-2-2 17:46
版主打扰了。请问您，checkbox这个勾选框在flexgrid里面，有没有出发的时间event；问一下。
你好，可以监听CellEditEnded事件，判断一下绑定列或值得类型即可，参考以下代码：
import 'bootstrap.css';
import '@grapecity/wijmo.styles/wijmo.css';
import { SortDescription, format } from '@grapecity/wijmo';
import { FlexGrid } from '@grapecity/wijmo.grid';
document.readyState === 'complete' ? init() : window.onload = init;
function init() {
// create some random data
var countries = 'US,Germany,UK,Japan,Italy,Greece'.split(',');
var data = [];
for (var i = 0; i < countries.length; i++) {
data.push({
id: i,
country: countries,
sales: Math.random() * 10000,
expenses: Math.random() * 5000,
bool: true
});
}
// bind a grid to the raw data
var theGrid = new FlexGrid('#theGrid', {
autoGenerateColumns: false,
columns: [
{ binding: 'country', header: 'Country', width: '2*' },
{ binding: 'sales', header: 'Sales', width: '*', format: 'n2' },
{ binding: 'expenses', header: 'Expenses', width: '*', format: 'n2' },
{ binding: 'bool', header: 'Bool'}
],
itemsSource: data,
cellEditEnded: (s, e) => {
console.log(s, e)
}
});
// show the current item
var selItemElement = document.getElementById('selectedItem');
function updateCurrentInfo() {
selItemElement.innerHTML = format('Country: <b>{country}</b>, Sales: <b>{sales:c0}</b> Expenses: <b>{expenses:c0}</b>', theGrid.collectionView.currentItem);
}
// update current item now and when the grid selection changes
updateCurrentInfo();
theGrid.collectionView.currentChanged.addHandler(updateCurrentInfo);
// sort the data by country
var sd = new SortDescription('country', true);
theGrid.collectionView.sortDescriptions.push(sd);
}
把上述代码放到实例的app.js里即可看到效果：
https://www.grapecity.com/wijmo/demos/Grid/Data-binding/Basics/purejs
注意看控制台，打印的参数内容中有你需要的信息。
页:
[1]