如何获取FlexGrid和MultiRow的数据校验结果

KevinChen

本帖最后由 dllyzs 于 2020-11-23 17:50 编辑

我想在画面上的按钮点击事件中获取FlexGrid和MultiRow的校验结果，如果存在数据错误的话，就不进行提交。该如何获取呢？

KevinChen · KevinChen

您好，根据官方示例简单修改一下即可实现，我实现了一版，参考以下代码：

import 'bootstrap.css';
import '@grapecity/wijmo.styles/wijmo.css';
import './styles.css';
//
import * as wijmo from '@grapecity/wijmo';
import * as grid from '@grapecity/wijmo.grid';
import { countries, getData } from './data';
//
document.readyState === 'complete' ? init() : window.onload = init;
//
function init() {
// create a CollectionView
let view = new wijmo.CollectionView(getData(), {
sortDescriptions: ['country'],
getError,
});
//
// CollectionView validation function
function getError(item, propName) {
switch (propName) {
case 'country':
return countries.indexOf(item.country) < 0 ? 'Invalid Country' : '';
case 'downloads':
case 'sales':
case 'expenses':
return item[propName] < 0 ? 'Negative values not allowed!' : '';
case 'active':
return item.active && item.country.match(/^(US|Germany)$/)
? 'Active items not allowed in the US or Germany!'
: '';
case null:
let errors = [];
for (let key in item) {
let err = getError(item, key);
if (err)
errors.push(err);
}
return errors.length > 1
? 'this item has ' + errors.length + ' errors'
: (errors.length == 1 ? errors[0] : null);
case undefined:
let errorsAll = [];
for (let key in item) {
let err = getError(item, key);
if (err)
errorsAll.push(err);
}
return errorsAll.length? errorsAll:null;
}
return null;
}
//
// create grid for editing with validation
let theGrid = new grid.FlexGrid('#theGrid', {
itemsSource: view
});
//
// use getError to provide form validation
let theItem = {};
//
document.getElementById('theForm').addEventListener('input', e => {
});
//
document.getElementById('theForm').addEventListener('submit', e => {
e.preventDefault()
// debugger
view.sourceCollection.forEach((item)=>{
console.log(view.getError(item));
});
});
}

复制代码

测试地址：
https://www.grapecity.com/wijmo/ ... s/Validation/purejs

KevinChen · KevinChen

您好，Wijmo的数据校验是在数据源对象 CollectionView中实现的，请参考这个实例：

https://demo.grapecity.com.cn/wi ... s/Validation/purejs

dllyzs · dllyzs

那能获得校验结果么？像附件那样点击submit后可以获得grid的校验结果，如果错误就不执行后续的操作？

dllyzs · dllyzs

非常感谢！
我以为会有一个函数可以直接取得。。

KevinChen · KevinChen

感谢反馈，这里暂时没有一个方法可以直接获取到结果，所以需要做一些扩展才能实现。

		自动登录	找回密码
密码			立即注册

[已处理] 如何获取FlexGrid和MultiRow的数据校验结果

最佳答案

5 个回复

评分

本帖子中包含更多资源

讲师达人

悬赏达人

元老葡萄

SpreadJS 认证

SpreadJS 高级认证

微信认证勋章