gridjs-spreadsheet 25.7.0 → 25.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/example/README.md +44 -329
- package/example/pom.xml +3 -3
- package/example/src/main/java/com/aspose/gridjs/demo/MyConfig.java +2 -14
- package/package.json +1 -1
- package/readme.md +87 -15
- package/xspreadsheet.css +153 -2
- package/xspreadsheet.js +5 -5
package/example/README.md
CHANGED
|
@@ -1,356 +1,71 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
> this is the client side script for GridJs which is a lightweight, scalable, and customizable toolkit that provides cross-platform web applications, enables convenient development for editing or viewing Excel/Spreadsheet files, offers simple deployment, and provides easy-to-use APIs
|
|
4
|
-
|
|
5
|
-
- [API](#api)
|
|
6
|
-
- [Preview](#preview)
|
|
7
|
-
- [Github Demos](#github-demos)
|
|
8
|
-
- [Features](#features)
|
|
9
|
-
- [Documentation](#documentation)
|
|
10
|
-
- [Support](#support)
|
|
11
|
-
- [License](#license)
|
|
12
|
-
|
|
13
|
-
## About
|
|
14
|
-
|
|
15
|
-
It allows you to view and edit spreadsheet files with ease.
|
|
16
|
-
|
|
17
|
-
this is developed based on https://github.com/myliang/x-spreadsheet
|
|
18
|
-
|
|
19
|
-
Quick online demo: https://products.aspose.app/cells/editor
|
|
20
|
-
|
|
21
|
-
## Preview
|
|
1
|
+
[Product Page](https://products.aspose.com/cells/java) | [Docs](https://docs.aspose.com/cells/java/aspose-cells-gridjs/) | [API Reference](https://reference.aspose.com/cells/java/com.aspose.gridjs/) | [Demos](https://products.aspose.app/cells/family/) | [Blog](https://blog.aspose.com/category/cells/) | [Code Samples](https://github.com/aspose-cells/Aspose.Cells-for-Java/tree/master/Examples.GridJs) | [Free Support](https://forum.aspose.com/c/cells) | [Temporary License](https://purchase.aspose.com/temporary-license) | [EULA](https://company.aspose.com/legal/eula)
|
|
22
2
|
|
|
23
|
-
|
|
3
|
+
Try our [free online apps](https://products.aspose.app/cells/family) demonstrating some of the most popular Aspose.Cells functionality.
|
|
24
4
|
|
|
5
|
+
[Aspose.Cells.GridJs for Java](http://www.aspose.com/products/cells/java) is a lightweight, scalable, and customizable toolkit that provides cross-platform web applications, enables convenient development for editing or viewing Excel/Spreadsheet files, offers simple deployment, and provides easy-to-use APIs.
|
|
25
6
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
APIs are available on the [API page](https://docs.aspose.com/cells/net/aspose-cells-gridjs/how-to-use-gridjs-client-api/).
|
|
7
|
+
This is a demo to show how we can use GridJs to implment a spreadsheet Editor .
|
|
29
8
|
|
|
30
|
-
## CDN
|
|
31
|
-
```html
|
|
32
|
-
<head>
|
|
33
|
-
<!-- other dependency start -->
|
|
34
|
-
<link rel="stylesheet" href="https://unpkg.com/bootstrap@5.2.3/dist/css/bootstrap.min.css">
|
|
35
|
-
<link rel="stylesheet" href="https://unpkg.com/jquery-ui@1.13.2/dist/themes/ui-lightness/jquery-ui.min.css">
|
|
36
|
-
<script src="https://unpkg.com/jquery@3.6.0/dist/jquery.min.js"></script>
|
|
37
|
-
<script src="https://unpkg.com/jquery-ui@1.13.2/dist/jquery-ui.min.js"></script>
|
|
38
|
-
<script src="https://unpkg.com/jszip@3.10.1/dist/jszip.min.js"></script>
|
|
39
|
-
<!-- other dependency end -->
|
|
40
|
-
<link rel="stylesheet" href="https://unpkg.com/gridjs-spreadsheet/xspreadsheet.css">
|
|
41
|
-
<script src="https://unpkg.com/gridjs-spreadsheet/xspreadsheet.js"></script>
|
|
42
|
-
|
|
43
|
-
<script>
|
|
44
|
-
const option = {
|
|
45
|
-
updateMode: 'server',
|
|
46
|
-
updateUrl: '/GridJs2/UpdateCell',
|
|
47
|
-
showToolbar: true,
|
|
48
|
-
//mode: 'edit' or 'read'
|
|
49
|
-
mode: 'read',
|
|
50
|
-
//support multiple language ,the locale is:en, cn, es, pt, de, ru, nl, ar, fr,id,it,ja, ko,th,tr,vi,cht
|
|
51
|
-
local: 'en',
|
|
52
|
-
};
|
|
53
|
-
const sheetstr="[{\"name\":\"Sheet1\",\"sheetid\":\"s0\",\"showGrid\":true,\"sprotected\":false,\"canselectlocked\":true,\"displayRight2Left\":false,\"canselectunlocked\":true,\"styles\":[{\"textwrap\":true,\"color\":\"#000000\",\"valign\":\"middle\",\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"italic\":false}},{\"textwrap\":false,\"color\":\"#000000\",\"valign\":\"middle\",\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"italic\":false}}],\"cols\":{\"0\":{\"width\":72},\"1\":{\"width\":72},\"2\":{\"width\":532},\"3\":{\"width\":72},\"4\":{\"width\":72},\"5\":{\"width\":72},\"6\":{\"width\":72},\"7\":{\"width\":72},\"8\":{\"width\":72},\"9\":{\"width\":72},\"10\":{\"width\":72},\"11\":{\"width\":72},\"12\":{\"width\":72},\"13\":{\"width\":72},\"14\":{\"width\":72},\"15\":{\"width\":72},\"len\":16},\"rows\":{\"3\":{\"height\":122,\"cells\":{\"2\":{\"text\":\"FFF呜呜呜\\n呜我 我我我我\\nnice wwwwww\\nexample work 测的的的的的的的到\\n到手 一级 一季报 击败发发发发发发发发发发发\",\"style\":0,\"rtxt\":[{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"italic\":false},\"txt\":\"F\"},{\"font\":{\"name\":\"arial\",\"size\":18,\"bold\":false,\"color\":\"#953735\",\"italic\":false},\"txt\":\"FF呜\"},{\"font\":{\"name\":\"arial\",\"size\":18,\"bold\":false,\"color\":\"#953735\",\"underline\":\"single\",\"italic\":false},\"txt\":\"呜\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"underline\":\"single\",\"italic\":false},\"txt\":\"呜\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"italic\":false},\"txt\":\"\\n呜\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#0070C0\",\"italic\":false},\"txt\":\"我 我我\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"italic\":false},\"txt\":\"我我\\nni\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":true,\"color\":\"#C00000\",\"italic\":true},\"txt\":\"ce wwwwww\\nexample\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"italic\":false},\"txt\":\" work \"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#C0504D\",\"italic\":false},\"txt\":\"测的的的\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#C0504D\",\"underline\":\"double\",\"italic\":false},\"txt\":\"的的\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"underline\":\"double\",\"italic\":false},\"txt\":\"的\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"italic\":false},\"txt\":\"的到\\n到手 \"},{\"font\":{\"name\":\"arial\",\"size\":18,\"bold\":false,\"color\":\"#000000\",\"italic\":false},\"txt\":\"一级 一季\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"italic\":false},\"txt\":\"报 击败发\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#9BBB59\",\"italic\":false},\"txt\":\"发发发发发发\"},{\"font\":{\"name\":\"arial\",\"size\":11,\"bold\":false,\"color\":\"#000000\",\"italic\":false},\"txt\":\"发发发发\"}],\"html\":\"<Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\">F</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 18pt;COLOR: #953735;\\\">FF呜</Font><Font Style=\\\"TEXT-DECORATION: underline;FONT-FAMILY: arial;FONT-SIZE: 18pt;COLOR: #953735;\\\">呜</Font><Font Style=\\\"TEXT-DECORATION: underline;FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\">呜</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\"><Br>呜</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #0070c0;\\\">我 我我</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\">我我<Br>ni</Font><Font Style=\\\"FONT-WEIGHT: bold;FONT-STYLE: italic;FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #c00000;\\\">ce wwwwww<Br>example</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\"> work </Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #c0504d;\\\">测的的的</Font><Font Style=\\\"TEXT-DECORATION: underline;FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #c0504d;\\\">的的</Font><Font Style=\\\"TEXT-DECORATION: underline;FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\">的</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\">的到<Br>到手 </Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 18pt;COLOR: #000000;\\\">一级 一季</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\">报 击败发</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #9bbb59;\\\">发发发发发发</Font><Font Style=\\\"FONT-FAMILY: arial;FONT-SIZE: 11pt;COLOR: #000000;\\\">发发发发</Font>\"},\"4\":{\"text\":\"\",\"style\":1}}},\"len\":13,\"height\":19}},{\"name\":\"Sheet2\",\"sheetid\":\"s1\",\"showGrid\":true,\"sprotected\":false,\"canselectlocked\":true,\"displayRight2Left\":false,\"canselectunlocked\":true,\"cols\":{\"0\":{\"width\":72},\"1\":{\"width\":72},\"2\":{\"width\":72},\"3\":{\"width\":72},\"4\":{\"width\":72},\"5\":{\"width\":72},\"6\":{\"width\":72},\"7\":{\"width\":72},\"8\":{\"width\":72},\"9\":{\"width\":72},\"10\":{\"width\":72},\"11\":{\"width\":72},\"12\":{\"width\":72},\"13\":{\"width\":72},\"14\":{\"width\":72},\"15\":{\"width\":72},\"len\":16},\"rows\":{\"12\":{\"height\":19,\"cells\":{\"15\":{\"text\":\"\"}}},\"len\":13,\"height\":19}},{\"name\":\"Sheet3\",\"sheetid\":\"s2\",\"showGrid\":true,\"sprotected\":false,\"canselectlocked\":true,\"displayRight2Left\":false,\"canselectunlocked\":true,\"cols\":{\"0\":{\"width\":72},\"1\":{\"width\":72},\"2\":{\"width\":72},\"3\":{\"width\":72},\"4\":{\"width\":72},\"5\":{\"width\":72},\"6\":{\"width\":72},\"7\":{\"width\":72},\"8\":{\"width\":72},\"9\":{\"width\":72},\"10\":{\"width\":72},\"11\":{\"width\":72},\"12\":{\"width\":72},\"13\":{\"width\":72},\"14\":{\"width\":72},\"15\":{\"width\":72},\"len\":16},\"rows\":{\"12\":{\"height\":19,\"cells\":{\"15\":{\"text\":\"\"}}},\"len\":13,\"height\":19}}]";
|
|
54
|
-
xs = x_spreadsheet('#gridjs-demo', option).loadData(JSON.parse(sheetstr)).change((cdata) => {
|
|
55
|
-
console.log(cdata);
|
|
56
|
-
console.log(xs.validate());
|
|
57
|
-
}
|
|
58
|
-
</script>
|
|
59
|
-
</head>
|
|
60
|
-
<body>
|
|
61
|
-
<div id="gridjs-demo"></div>
|
|
62
|
-
</body>
|
|
63
|
-
```
|
|
64
|
-
|
|
65
|
-
## NPM
|
|
66
|
-
|
|
67
|
-
```shell
|
|
68
|
-
npm install gridjs-spreadsheet
|
|
69
|
-
```
|
|
70
|
-
|
|
71
|
-
```html
|
|
72
|
-
<div id="gridjs-demo"></div>
|
|
73
|
-
```
|
|
74
9
|
|
|
75
|
-
|
|
76
|
-
//includ all the dependencies
|
|
77
|
-
//Including jszip
|
|
78
|
-
import JSZip from 'jszip';
|
|
79
|
-
window.JSZip = JSZip;
|
|
80
|
-
//Including jQuery
|
|
81
|
-
import $ from 'jquery';
|
|
82
|
-
window.$ = $;
|
|
83
|
-
//Including gridjs-spreadsheet
|
|
84
|
-
import 'gridjs-spreadsheet/xspreadsheet.css';
|
|
85
|
-
import Spreadsheet from "gridjs-spreadsheet";
|
|
86
|
-
|
|
87
|
-
// If you need to override the default options, you can set the override
|
|
88
|
-
// const options = {};
|
|
89
|
-
// new Spreadsheet('#gridjs-demo', options);
|
|
90
|
-
const s = new Spreadsheet("#gridjs-demo")
|
|
91
|
-
.loadData({}) // load data
|
|
92
|
-
.change(data => {
|
|
93
|
-
// save data to db
|
|
94
|
-
});
|
|
10
|
+
## Preview
|
|
95
11
|
|
|
96
|
-
|
|
97
|
-
```
|
|
12
|
+
<img alt='demo' src='https://unpkg.com/gridjs-spreadsheet@25.1.0/preview.gif' />
|
|
98
13
|
|
|
14
|
+
## How to Run the Examples
|
|
15
|
+
###1.edit the properties in src\main\resources\application.properties to meet your local environment
|
|
16
|
+
```properties
|
|
17
|
+
# This is the directory contains the spread sheet files
|
|
18
|
+
testconfig.ListDir=/app/wb
|
|
99
19
|
|
|
100
|
-
|
|
20
|
+
# Directory for storing cache files
|
|
21
|
+
testconfig.CachePath=/app/grid_cache
|
|
101
22
|
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
// If you need to override the default options, you can set the override
|
|
105
|
-
const option = {
|
|
106
|
-
updateMode: 'server',
|
|
107
|
-
updateUrl: '/GridJs2/UpdateCell',
|
|
108
|
-
showToolbar: true,
|
|
109
|
-
//mode: 'edit' or 'read'
|
|
110
|
-
mode: 'read',
|
|
111
|
-
//support multiple language ,the locale is:en, cn, es, pt, de, ru, nl, ar, fr,id,it,ja, ko,th,tr,vi,cht
|
|
112
|
-
local: 'en',
|
|
113
|
-
};
|
|
114
|
-
|
|
115
|
-
xs = x_spreadsheet('#gridjs-demo', option).loadData(sheets).change((cdata) => {
|
|
116
|
-
console.log(cdata);
|
|
117
|
-
|
|
118
|
-
}
|
|
23
|
+
# Directory for storing upload files
|
|
24
|
+
testconfig.UploadPath=/app/upload
|
|
119
25
|
|
|
120
|
-
|
|
26
|
+
# License file for Aspose.Cells
|
|
27
|
+
testconfig.AsposeLicensePath=/app/license
|
|
121
28
|
```
|
|
29
|
+
###2.run src\main\java\com\aspose\gridjs\demo\GridjsdemoApplication.java
|
|
122
30
|
|
|
123
|
-
|
|
124
|
-
// default options
|
|
125
|
-
{
|
|
126
|
-
mode: 'edit', // edit | read
|
|
127
|
-
showToolbar: true,
|
|
128
|
-
showGrid: true,
|
|
129
|
-
showContextmenu: true,
|
|
130
|
-
view: {
|
|
131
|
-
height: () => document.documentElement.clientHeight,
|
|
132
|
-
width: () => document.documentElement.clientWidth,
|
|
133
|
-
},
|
|
134
|
-
row: {
|
|
135
|
-
len: 100,
|
|
136
|
-
height: 25,
|
|
137
|
-
},
|
|
138
|
-
col: {
|
|
139
|
-
len: 26,
|
|
140
|
-
width: 100,
|
|
141
|
-
indexWidth: 60,
|
|
142
|
-
minWidth: 60,
|
|
143
|
-
},
|
|
144
|
-
style: {
|
|
145
|
-
bgcolor: '#ffffff',
|
|
146
|
-
align: 'left',
|
|
147
|
-
valign: 'middle',
|
|
148
|
-
textwrap: false,
|
|
149
|
-
strike: false,
|
|
150
|
-
underline: false,
|
|
151
|
-
color: '#0a0a0a',
|
|
152
|
-
font: {
|
|
153
|
-
name: 'Helvetica',
|
|
154
|
-
size: 10,
|
|
155
|
-
bold: false,
|
|
156
|
-
italic: false,
|
|
157
|
-
},
|
|
158
|
-
},
|
|
159
|
-
}
|
|
160
|
-
```
|
|
31
|
+
open browser and navigate to view all the files in the directory at http://localhost:8080/gridjsdemo/list
|
|
161
32
|
|
|
162
|
-
|
|
33
|
+
## Step to run in docker
|
|
163
34
|
|
|
164
|
-
|
|
165
|
-
```javascript
|
|
166
|
-
// single selection
|
|
167
|
-
xs.on('cell-selected', (cell, ri, ci) => {});
|
|
168
|
-
// range selection
|
|
169
|
-
xs.on('cells-selected', (cell, { sri, sci, eri, eci }) => {});
|
|
170
|
-
// shape/image selection
|
|
171
|
-
xs.on('object-selected', (obj) => { console.log('obj id:', obj.id, ', type: ', obj.type); })
|
|
172
|
-
// edited on cell
|
|
173
|
-
xs.on('cell-edited', (text, ri, ci) => {});
|
|
174
|
-
// cells updated
|
|
175
|
-
xs.on('cells-updated', (name, cells) => {
|
|
176
|
-
console.log('cells updated for sheet name:', name);
|
|
177
|
-
cells.forEach((acell, index, array) => {
|
|
178
|
-
console.log('acell got updated:', acell);
|
|
179
|
-
})
|
|
180
|
-
})
|
|
181
|
-
// cells deleted
|
|
182
|
-
xs.on('cells-deleted', (range) => {
|
|
183
|
-
console.log('cells deleted :', range);
|
|
184
|
-
})
|
|
185
|
-
// rows deleted
|
|
186
|
-
xs.on('rows-deleted', (ri, n) => {
|
|
187
|
-
console.log('rows-deleted :', ri, ",size", n);
|
|
188
|
-
})
|
|
189
|
-
// columns deleted
|
|
190
|
-
xs.on('columns-deleted', (ci, n) => {
|
|
191
|
-
console.log('columns-deleted :', ci, ",size", n);
|
|
192
|
-
})
|
|
193
|
-
// rows inserted
|
|
194
|
-
xs.on('rows-inserted', (ri, n) => {
|
|
195
|
-
console.log('rows-inserted :', ri, ",size", n);
|
|
196
|
-
})
|
|
197
|
-
// columns inserted
|
|
198
|
-
xs.on('columns-inserted', (ci, n) => {
|
|
199
|
-
console.log('columns-inserted :', ci, ",size", n);
|
|
200
|
-
})
|
|
35
|
+
1. docker build -t gridjs-demo-java .
|
|
201
36
|
|
|
202
|
-
|
|
37
|
+
2. run with aspose license file:
|
|
203
38
|
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
// cellText(ri, ci, text, sheetIndex = 0)
|
|
208
|
-
xs.cellText(5, 5, 'xxxx',0).cellText(6, 5, 'yyy',0).reRender();
|
|
39
|
+
```bash
|
|
40
|
+
docker run -d -p 8080:8080 -v C:/path/to/license.txt:/app/license gridjs-demo-java
|
|
209
41
|
```
|
|
210
42
|
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
xs.cell(ri, ci);
|
|
216
|
-
// cellStyle(ri, ci, sheetIndex = 0)
|
|
217
|
-
xs.cellStyle(ri, ci);
|
|
43
|
+
or just run the demo in trial mode:
|
|
44
|
+
|
|
45
|
+
```bash
|
|
46
|
+
docker run -d -p 8080:8080 gridjs-demo-java
|
|
218
47
|
```
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
## Features
|
|
222
|
-
|
|
223
|
-
- Localization/Multiple language UI
|
|
224
|
-
- Paint format
|
|
225
|
-
- Clear format
|
|
226
|
-
- Format
|
|
227
|
-
- Number Format
|
|
228
|
-
- Font/Font size/ bold/italic/Underline/Strike
|
|
229
|
-
- Highlight
|
|
230
|
-
- Shape/Image resize/rotate/position ajustment
|
|
231
|
-
- Text color/Align/wrapping
|
|
232
|
-
- Fill color
|
|
233
|
-
- RichText
|
|
234
|
-
- Borders
|
|
235
|
-
- Merge cells
|
|
236
|
-
- Freeze cell
|
|
237
|
-
- Copy, Cut, Paste
|
|
238
|
-
- Autofill
|
|
239
|
-
- Insert/Delete row, column
|
|
240
|
-
- Filter row, column
|
|
241
|
-
- Zoom in/out
|
|
242
|
-
- Sort
|
|
243
|
-
- Search
|
|
244
|
-
- Formula
|
|
245
|
-
- Resize row-height, col-width
|
|
246
|
-
- Switch/add/delete sheets
|
|
247
|
-
- Condition Format
|
|
248
|
-
- Comment
|
|
249
|
-
- Add/delete Links
|
|
250
|
-
- Print
|
|
251
|
-
- Data validations
|
|
252
|
-
- Insert picture from web page
|
|
253
|
-
- Display chart/shapes
|
|
254
|
-
- Display form controls /activeX controls
|
|
255
|
-
- Insert/Delete form controls
|
|
256
|
-
- Insert/Delete common shapes for autoshape
|
|
257
|
-
- Support display two colors gradient in fill effects
|
|
258
|
-
- Mobile compatibility
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
## Github-Demos
|
|
262
|
-
|
|
263
|
-
Visit the GridJs demo to find more detail info:
|
|
264
|
-
|
|
265
|
-
https://github.com/aspose-cells/Aspose.Cells-for-.NET/tree/master/Examples_GridJs
|
|
266
|
-
|
|
267
|
-
https://github.com/aspose-cells/Aspose.Cells-for-Java/tree/master/Examples.GridJs
|
|
268
|
-
|
|
269
|
-
https://github.com/aspose-cells/Aspose.Cells-for-Python-via-.NET/tree/main/Examples_GridJs_Python_Net
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
## Documentation
|
|
274
|
-
|
|
275
|
-
Online documentation is available here:
|
|
276
|
-
|
|
277
|
-
- [Developer's Guide C#](https://docs.aspose.com/cells/net/aspose-cells-gridjs/)
|
|
278
|
-
- [API Reference C#](https://docs.aspose.com/cells/net/aspose-cells-gridjs/client/)
|
|
279
|
-
- [Developer's Guide Python](https://docs.aspose.com/cells/python-net/aspose-cells-gridjs/)
|
|
280
|
-
- [API Reference Python](https://docs.aspose.com/cells/python-net/aspose-cells-gridjs/client/)
|
|
281
|
-
- [Developer's Guide JAVA](https://docs.aspose.com/cells/java/aspose-cells-gridjs/)
|
|
282
|
-
- [API Reference JAVA](https://docs.aspose.com/cells/java/aspose-cells-gridjs/client/)
|
|
283
|
-
|
|
284
|
-
## Browser Support
|
|
285
|
-
|
|
286
|
-
Modern browsers(chrome, firefox, Safari).
|
|
287
|
-
|
|
288
|
-
## Version History
|
|
289
|
-
|
|
290
|
-
v24.9.1:
|
|
291
|
-
|
|
292
|
-
- fix bug that fail to insert column in the new added worksheet
|
|
293
|
-
- fix bug that fail to rename worksheet
|
|
294
|
-
- support lazy loading
|
|
295
|
-
|
|
296
|
-
v24.10:
|
|
297
|
-
|
|
298
|
-
- support a view option to show formulas
|
|
299
|
-
|
|
300
|
-
v24.11:
|
|
301
|
-
|
|
302
|
-
- improve the display of rich text cell values
|
|
303
|
-
|
|
304
|
-
v24.12:
|
|
305
|
-
|
|
306
|
-
- support API to show HTML nodes and interact with HTML nodes at specified cell positions
|
|
307
|
-
- support pre-check event for row/column delete/insert operations
|
|
308
|
-
- support row/column insert/delete events for client APIs
|
|
309
|
-
- support events for updating cells
|
|
310
|
-
- support multiple instances on one page
|
|
311
|
-
|
|
312
|
-
v25.1:
|
|
313
|
-
|
|
314
|
-
- support copy/paste from MS-Excel
|
|
315
|
-
|
|
316
|
-
v25.2:
|
|
317
|
-
|
|
318
|
-
- support copy/paste from MS-Excel
|
|
319
|
-
- enhancement for automatic operations for user’s convenience, such as extending blank row/column, page scrolling, …
|
|
320
|
-
|
|
321
|
-
v25.3:
|
|
322
|
-
|
|
323
|
-
- support more shotcut keys
|
|
324
|
-
- support pasting the content copied from excel to multiple target areas
|
|
325
|
-
|
|
326
|
-
v25.4:
|
|
327
|
-
|
|
328
|
-
- support show statistics information in the lower right corner when cells are selected
|
|
329
|
-
|
|
330
|
-
v25.5:
|
|
331
|
-
|
|
332
|
-
- add support for Polish menus.
|
|
333
|
-
- support APIs for insert/delete rows/columns
|
|
334
|
-
|
|
335
|
-
v25.6:
|
|
48
|
+
|
|
49
|
+
3. open browser and enter the url: http://localhost:8080/gridjsdemo/list
|
|
336
50
|
|
|
337
|
-
|
|
338
|
-
|
|
51
|
+
## Reference js lib used in the demo project:
|
|
52
|
+
jquery.js v2.1.1
|
|
339
53
|
|
|
340
|
-
|
|
54
|
+
jquery-ui.js v1.12.1
|
|
341
55
|
|
|
342
|
-
-
|
|
343
|
-
- Support APIs to add/modify/delete worksheet
|
|
344
|
-
- Support APIs to add/modify/delete comment
|
|
345
|
-
- Support APIs to set attribute for range of cells
|
|
346
|
-
- Support APIs to delete for range of cells
|
|
56
|
+
jquery-ui.css v1.12.1
|
|
347
57
|
|
|
348
|
-
|
|
58
|
+
jszip.min.js v3.6.0
|
|
349
59
|
|
|
350
|
-
|
|
60
|
+
bootstrap.css v22.5.5.2
|
|
351
61
|
|
|
352
|
-
|
|
62
|
+
quantumui.css v22.5.5.2
|
|
353
63
|
|
|
354
|
-
|
|
64
|
+
## Resources
|
|
355
65
|
|
|
356
|
-
|
|
66
|
+
+ **Website:** [www.aspose.com](http://www.aspose.com)
|
|
67
|
+
+ **Product Home:** [Aspose.Cells for Java](http://www.aspose.com/products/cells/java)
|
|
68
|
+
+ **Download:** [Download Aspose.Cells for Java](https://downloads.aspose.com/cells/java)
|
|
69
|
+
+ **Documentation:** [Aspose.Cells for Java Documentation](https://docs.aspose.com/display/cellsjava/Home)
|
|
70
|
+
+ **Forum:** [Aspose.Cells for Java Forum](http://www.aspose.com/community/forums/aspose.cells-product-family/19/showforum.aspx)
|
|
71
|
+
+ **Blog:** [Aspose.Cells for Java Blog](https://blog.aspose.com/category/aspose-products/aspose-cells-product-family/)
|
package/example/pom.xml
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<parent>
|
|
6
6
|
<groupId>org.springframework.boot</groupId>
|
|
7
7
|
<artifactId>spring-boot-starter-parent</artifactId>
|
|
8
|
-
<version>2.
|
|
8
|
+
<version>2.7.18</version>
|
|
9
9
|
<relativePath/> <!-- lookup parent from repository -->
|
|
10
10
|
</parent>
|
|
11
11
|
<repositories>
|
|
@@ -51,12 +51,12 @@
|
|
|
51
51
|
<dependency>
|
|
52
52
|
<groupId>com.aspose</groupId>
|
|
53
53
|
<artifactId>aspose-cells</artifactId>
|
|
54
|
-
<version>25.
|
|
54
|
+
<version>25.9</version>
|
|
55
55
|
</dependency>
|
|
56
56
|
<dependency>
|
|
57
57
|
<groupId>com.aspose</groupId>
|
|
58
58
|
<artifactId>aspose-cells</artifactId>
|
|
59
|
-
<version>25.
|
|
59
|
+
<version>25.9</version>
|
|
60
60
|
<classifier>gridjs</classifier>
|
|
61
61
|
</dependency>
|
|
62
62
|
<!-- <dependency>
|
|
@@ -2,13 +2,9 @@ package com.aspose.gridjs.demo;
|
|
|
2
2
|
|
|
3
3
|
import org.springframework.beans.factory.annotation.Value;
|
|
4
4
|
import org.springframework.context.annotation.Bean;
|
|
5
|
-
import org.springframework.context.annotation.ComponentScan;
|
|
6
5
|
import org.springframework.context.annotation.Configuration;
|
|
7
6
|
|
|
8
7
|
import com.aspose.gridjs.GridJsOptions;
|
|
9
|
-
import com.aspose.gridjs.GridJsService;
|
|
10
|
-
import com.aspose.gridjs.GridJsWorkbook;
|
|
11
|
-
import com.aspose.gridjs.IGridJsService;
|
|
12
8
|
|
|
13
9
|
@Configuration
|
|
14
10
|
public class MyConfig {
|
|
@@ -21,20 +17,12 @@ public class MyConfig {
|
|
|
21
17
|
|
|
22
18
|
|
|
23
19
|
@Bean
|
|
24
|
-
public GridJsWorkbook gridJsWorkbook() {
|
|
25
|
-
return new GridJsWorkbook();
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
@Bean
|
|
30
20
|
public GridJsOptions gridJsOptions() {
|
|
31
21
|
GridJsOptions options=new GridJsOptions();
|
|
32
22
|
options.setFileCacheDirectory(cachePath);
|
|
33
23
|
return options;
|
|
34
24
|
}
|
|
35
25
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
return new GridJsService(gridJsOptions);
|
|
39
|
-
}
|
|
26
|
+
|
|
27
|
+
|
|
40
28
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "gridjs-spreadsheet",
|
|
3
|
-
"version": "25.
|
|
3
|
+
"version": "25.9.0",
|
|
4
4
|
"description": "this is the client side script for GridJs which is a lightweight, scalable, and customizable toolkit that provides cross-platform web applications, enables convenient development for editing or viewing Excel/Spreadsheet files, offers simple deployment, and provides easy-to-use APIs based on JSON format.",
|
|
5
5
|
"types": "index.d.ts",
|
|
6
6
|
"main": "xspreadsheet.js",
|
package/readme.md
CHANGED
|
@@ -171,6 +171,34 @@ xs.on('cells-selected', (cell, { sri, sci, eri, eci }) => {});
|
|
|
171
171
|
xs.on('object-selected', (obj) => { console.log('obj id:', obj.id, ', type: ', obj.type); })
|
|
172
172
|
// edited on cell
|
|
173
173
|
xs.on('cell-edited', (text, ri, ci) => {});
|
|
174
|
+
// cells updated
|
|
175
|
+
xs.on('cells-updated', (name, cells) => {
|
|
176
|
+
console.log('cells updated for sheet name:', name);
|
|
177
|
+
cells.forEach((acell, index, array) => {
|
|
178
|
+
console.log('acell got updated:', acell);
|
|
179
|
+
})
|
|
180
|
+
})
|
|
181
|
+
// cells deleted
|
|
182
|
+
xs.on('cells-deleted', (range) => {
|
|
183
|
+
console.log('cells deleted :', range);
|
|
184
|
+
})
|
|
185
|
+
// rows deleted
|
|
186
|
+
xs.on('rows-deleted', (ri, n) => {
|
|
187
|
+
console.log('rows-deleted :', ri, ",size", n);
|
|
188
|
+
})
|
|
189
|
+
// columns deleted
|
|
190
|
+
xs.on('columns-deleted', (ci, n) => {
|
|
191
|
+
console.log('columns-deleted :', ci, ",size", n);
|
|
192
|
+
})
|
|
193
|
+
// rows inserted
|
|
194
|
+
xs.on('rows-inserted', (ri, n) => {
|
|
195
|
+
console.log('rows-inserted :', ri, ",size", n);
|
|
196
|
+
})
|
|
197
|
+
// columns inserted
|
|
198
|
+
xs.on('columns-inserted', (ci, n) => {
|
|
199
|
+
console.log('columns-inserted :', ci, ",size", n);
|
|
200
|
+
})
|
|
201
|
+
|
|
174
202
|
```
|
|
175
203
|
|
|
176
204
|
## update cell-text
|
|
@@ -196,6 +224,7 @@ xs.cellStyle(ri, ci);
|
|
|
196
224
|
- Paint format
|
|
197
225
|
- Clear format
|
|
198
226
|
- Format
|
|
227
|
+
- Number Format
|
|
199
228
|
- Font/Font size/ bold/italic/Underline/Strike
|
|
200
229
|
- Highlight
|
|
201
230
|
- Shape/Image resize/rotate/position ajustment
|
|
@@ -226,17 +255,18 @@ xs.cellStyle(ri, ci);
|
|
|
226
255
|
- Insert/Delete form controls
|
|
227
256
|
- Insert/Delete common shapes for autoshape
|
|
228
257
|
- Support display two colors gradient in fill effects
|
|
258
|
+
- Mobile compatibility
|
|
229
259
|
|
|
230
260
|
|
|
231
261
|
## Github-Demos
|
|
232
262
|
|
|
233
263
|
Visit the GridJs demo to find more detail info:
|
|
234
264
|
|
|
235
|
-
https://github.com/aspose-cells/Aspose.Cells-for-.NET/tree/master/Examples_GridJs
|
|
265
|
+
https://github.com/aspose-cells/Aspose.Cells.Grid-for-.NET/tree/master/Examples_GridJs
|
|
236
266
|
|
|
237
|
-
https://github.com/aspose-cells/Aspose.Cells-for-Java/tree/master/Examples.GridJs
|
|
267
|
+
https://github.com/aspose-cells/Aspose.Cells.Grid-for-Java/tree/master/Examples.GridJs
|
|
238
268
|
|
|
239
|
-
https://github.com/aspose-cells/Aspose.Cells-for-Python-via-.NET/tree/main/
|
|
269
|
+
https://github.com/aspose-cells/Aspose.Cells.Grid-for-Python-via-.NET/tree/main/Examples.GridJs
|
|
240
270
|
|
|
241
271
|
|
|
242
272
|
|
|
@@ -259,13 +289,13 @@ Modern browsers(chrome, firefox, Safari).
|
|
|
259
289
|
|
|
260
290
|
v24.9.1:
|
|
261
291
|
|
|
262
|
-
-
|
|
263
|
-
-
|
|
264
|
-
-
|
|
292
|
+
- Fix bug that fail to insert column in the new added worksheet
|
|
293
|
+
- Fix bug that fail to rename worksheet
|
|
294
|
+
- Support lazy loading
|
|
265
295
|
|
|
266
296
|
v24.10:
|
|
267
297
|
|
|
268
|
-
-
|
|
298
|
+
- Support a view option to show formulas
|
|
269
299
|
|
|
270
300
|
v24.11:
|
|
271
301
|
|
|
@@ -273,15 +303,57 @@ v24.11:
|
|
|
273
303
|
|
|
274
304
|
v24.12:
|
|
275
305
|
|
|
276
|
-
-
|
|
277
|
-
-
|
|
278
|
-
-
|
|
279
|
-
-
|
|
280
|
-
-
|
|
306
|
+
- Support API to show HTML nodes and interact with HTML nodes at specified cell positions
|
|
307
|
+
- Support pre-check event for row/column delete/insert operations
|
|
308
|
+
- Support row/column insert/delete events for client APIs
|
|
309
|
+
- Support events for updating cells
|
|
310
|
+
- Support multiple instances on one page
|
|
281
311
|
|
|
282
312
|
v25.1:
|
|
283
313
|
|
|
284
|
-
-
|
|
314
|
+
- Support copy/paste from MS-Excel
|
|
315
|
+
|
|
316
|
+
v25.2:
|
|
317
|
+
|
|
318
|
+
- Support copy/paste from MS-Excel
|
|
319
|
+
- Enhancement for automatic operations for user’s convenience, such as extending blank row/column, page scrolling, …
|
|
320
|
+
|
|
321
|
+
v25.3:
|
|
322
|
+
|
|
323
|
+
- Support more shotcut keys
|
|
324
|
+
- Support pasting the content copied from excel to multiple target areas
|
|
325
|
+
|
|
326
|
+
v25.4:
|
|
327
|
+
|
|
328
|
+
- Support show statistics information in the lower right corner when cells are selected
|
|
329
|
+
|
|
330
|
+
v25.5:
|
|
331
|
+
|
|
332
|
+
- Add support for Polish menus.
|
|
333
|
+
- Support APIs for insert/delete rows/columns
|
|
334
|
+
|
|
335
|
+
v25.6:
|
|
336
|
+
|
|
337
|
+
- Support APIs for resize rows/columns
|
|
338
|
+
- Support APIs for hide/unhide rows/columns
|
|
339
|
+
|
|
340
|
+
v25.7:
|
|
341
|
+
|
|
342
|
+
- Support APIs to enable /disable editable range
|
|
343
|
+
- Support APIs to add/modify/delete worksheet
|
|
344
|
+
- Support APIs to add/modify/delete comment
|
|
345
|
+
- Support APIs to set attribute for range of cells
|
|
346
|
+
- Support APIs to delete for range of cells
|
|
347
|
+
|
|
348
|
+
v25.8:
|
|
349
|
+
|
|
350
|
+
- Support automatic text wrapping
|
|
351
|
+
- Support API to apply font setting in textbox control
|
|
352
|
+
|
|
353
|
+
v25.9:
|
|
354
|
+
|
|
355
|
+
- Support to render pattern style for cell
|
|
356
|
+
|
|
285
357
|
|
|
286
358
|
## License
|
|
287
359
|
|
|
@@ -289,6 +361,6 @@ MIT
|
|
|
289
361
|
|
|
290
362
|
## Support
|
|
291
363
|
|
|
292
|
-
You can ask any question or request features using the [Forum](https://forum.aspose.com/c/cells).
|
|
364
|
+
You can ask any question or request features or report bugs using the [Forum](https://forum.aspose.com/c/cells).
|
|
293
365
|
|
|
294
|
-
[Product Page](https://products.aspose.com/cells) | [Product Documentation](https://docs.aspose.com/cells/net/aspose-cells-gridjs/) | [Blog](https://blog.aspose.com/category/cells/) |[API Reference](https://reference.aspose.com/cells/net/aspose.cells.gridjs/) | [Source Code Samples](https://github.com/aspose-cells/Aspose.Cells-for-.NET/tree/
|
|
366
|
+
[Product Page](https://products.aspose.com/cells) | [Product Documentation](https://docs.aspose.com/cells/net/aspose-cells-gridjs/) | [Blog](https://blog.aspose.com/category/cells/) |[API Reference](https://reference.aspose.com/cells/net/aspose.cells.gridjs/) | [Source Code Samples](https://github.com/aspose-cells/Aspose.Cells.Grid-for-.NET/tree/main/Examples_GridJs) | [Free Support](https://forum.aspose.com/c/cells)
|