Wijmo TransposedGrid 検証エラーの表示
by Wijmo5_jp
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.grapecity.com/wijmo/5.latest/styles/wijmo.min.css">
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/cultures/wijmo.culture.ja.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.transposed.min.js"></script>
<div class="container-fluid">
<p>金額列に負の値を入力すると検証エラーを表示します。</p>
<div id="transposedGrid"></div>
</div>
CSS
body {
margin: 50px 0;
}
JavaScript
document.readyState === 'complete' ? init() : window.onload = init;
function init() {
var transposedGrid = new wijmo.grid.transposed.TransposedGrid('#transposedGrid', {
itemsSource: new wijmo.collections.CollectionView(getData(5), {
getError: function (item, prop) {
if (prop == '金額' && item.金額 < 0) {
return '正の値を入力してください。';
}
}
})
});
}
var productNames = ['果汁100%オレンジ', '果汁100%グレープ', '果汁100%レモン', '果汁100%ピーチ', 'コーヒーマイルド', 'コーヒービター', 'コーヒーミルク', 'ピリピリビール', 'オタル白ラベル', 'バードワイン'];
function random(max, min) {
if (!min) min = 0;
return Math.floor(Math.random() * (max - min)) + min;
}
function randomDate() {
let date = new Date((new Date()).getFullYear() - 5, 3, 1);
return wijmo.DateTime.addDays(date, random(365 * 5));
}
function getData(length) {
let data = [];
for (let i = 0; i < length; i++) {
data.push({
No: i,
商品名: productNames[random(productNames.length)],
受注日: randomDate(),
金額: random(99, 1) * 100,
値引: random(3) == 0
});
}
data[0].金額 = -1000;
return data;
}