https://github.com/n3ps/paste-from-excel
Utility to allow pasting data intact from Excel into an HTML table with editable elements
https://github.com/n3ps/paste-from-excel
clipboard copy-paste excel html-tables
Last synced: 11 months ago
JSON representation
Utility to allow pasting data intact from Excel into an HTML table with editable elements
- Host: GitHub
- URL: https://github.com/n3ps/paste-from-excel
- Owner: n3ps
- Created: 2020-05-03T02:14:43.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2021-06-30T01:55:13.000Z (almost 5 years ago)
- Last Synced: 2024-11-16T15:21:12.488Z (over 1 year ago)
- Topics: clipboard, copy-paste, excel, html-tables
- Language: JavaScript
- Size: 8.79 KB
- Stars: 7
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# paste-from-excel
Utility to allow pasting data intact from Excel (or any spreadsheet) into an HTML table with editable elements.
Requires a table with input elements or elements with contenteditable set to true.
## Install
```
npm install paste-from-excel
```
## Usage with libraries
### Material UI \
```jsx
import parse from 'paste-from-excel'
const handlePaste = (e) => {
return parse(e)
}
return (
/* TableCells with inputs */
)
```
### React-Table
```jsx
import parse from 'paste-from-excel'
const handlePaste = (e) => {
const options = {
rowSelector: '.rt-tr-group',
cellSelector: '.rt-td'
}
return parse(e, options)
}
return (
)
```
## Usage with plain HTML
```html
<table id="my-table">
<tr>
<td><input /></td>
<td><input /></td>
</tr>
</table>
<script>
var myTable = document.querySelector('#my-table')
myTable.addEventListener('paste', handlePaste)
function handlePaste (e) {
return window.PasteFromExcel(e)
}
```
### Options
rowSelector
- Sets the selector to identify a "row". Default: `tr`
cellSelector
- Sets the selector to identify a "cell". Default: `td`
inputSelector
- Sets the selector for the element that act on the paste event, and to find suceeding "editable elements". Default: `input`