(empty log message)
@@ -0,0 +1,57 @@ | ||
1 | +<!doctype html> | |
2 | +<html lang="ja"> | |
3 | +<head> | |
4 | +<title>Jspreadsheet Example</title> | |
5 | +</head> | |
6 | +<body> | |
7 | +<div id="mytable"></div> | |
8 | +<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> | |
9 | +<script src="https://bossanova.uk/jspreadsheet/v4/jexcel.js"></script> | |
10 | +<script src="https://jsuites.net/v4/jsuites.js"></script> | |
11 | +<link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css"> | |
12 | +<link rel="stylesheet" href="https://bossanova.uk/jspreadsheet/v4/jexcel.css" type="text/css"> | |
13 | +<script> | |
14 | + | |
15 | +var old_xy; | |
16 | +var old_time; | |
17 | +var selectionActive = function(instance, x1, y1, x2, y2, origin) { | |
18 | + if (x1 != 1) return; | |
19 | + var cellName1 = jexcel.getColumnNameFromId([x1, y1]); | |
20 | + var cellName2 = jexcel.getColumnNameFromId([x2, y2]); | |
21 | + $('#log').append('The selection from ' + cellName1 + ' to ' + cellName2 + '<br>'); | |
22 | + var xy = x1 + '_' + y1; | |
23 | + var time = Date.now(); | |
24 | + if (x1 == x2 && y1 == y2) { | |
25 | + if (old_xy == xy) { | |
26 | + if (time - old_time < 2000) { | |
27 | + var a = prompt(''); | |
28 | + myTable.setValue(cellName1, a); | |
29 | + } | |
30 | + } | |
31 | + } | |
32 | + old_xy = xy; | |
33 | + old_time = time; | |
34 | +} | |
35 | +const myTable = jspreadsheet(document.getElementById('mytable'), { | |
36 | + data: [ | |
37 | + ['2022/10/24', '文房具', 420], | |
38 | + ['2022/10/26', '外食費', 1300] | |
39 | + ], | |
40 | + onselection: selectionActive, | |
41 | + allowInsertColumn:false, | |
42 | + allowManualInsertRow:false, | |
43 | + allowDeleteColumn:false, | |
44 | + allowRenameColumn:false, | |
45 | + allowExport:false, | |
46 | + columnSorting:false, | |
47 | + about:false, | |
48 | + columns: [ | |
49 | + { type: 'calendar', title: '日付', width: 120, options: { format: 'YYYY/MM/DD' } }, | |
50 | + { type: 'text', title: '項目', width: 300 }, | |
51 | + { type: 'numeric', title: '出金', width: 200, mask:'#,##' }, | |
52 | + ] | |
53 | +}); | |
54 | +</script> | |
55 | +<div id="log"></div> | |
56 | +</body> | |
57 | +</html> |